使用主干的 RESTful api

Question

我有一个主干应用程序和一个 RESTful api。我使用 Coenraets 创建的示例来了解主干应用程序的架构，但我决定设置自己的结构并仅使用数据进行测试。

我想知道从 RESTful api 返回数据的最佳方式。我目前有我的应用程序文件夹结构设置，其中包含模型、集合、视图和服务文件夹。我有一个运行 express 的节点服务器，它处理后端并且工作正常。

我想知道的是访问restful data api的最佳实践是什么？我应该在我的服务类还是在我的视图类中这样做？如何使用从我的 restful api 返回的数据动态地使这项工作：http://localhost:3000/employees

似乎有很多方法可以做到这一点，现在我只想要一些可行的方法，但最终我确实想知道什么是最好的方法。最终我想要一个 CRUD 设置。但我不确定应该在哪里设置。类似于这里详述的内容：http://www.codeproject.com/Articles/797899/BackBone-Tutorial-Part-CRUD-Operations-on-Backbone

我的文件如下：

employeecolletion.js

var Backbone = require('backbone');
var Employee = require('../models/employeemodel.js');

module.exports = Backbone.Collection.extend({
    model: Employee,
    url:"http://localhost:3000/employees"
});

employeemodel.js

var Backbone = require('backbone');
var EmployeeCollection = require('../collections/employeecollection.js');

module.exports = Backbone.Model.extend({

    urlRoot:"http://localhost:3000/employees" 

    // initialize:function () {
    //     this.reports = new EmployeeCollection();
    //     //this.reports.url = this.urlRoot + "/" + 1 + "/reports";

    // }

});

employee.js（绑定到我的模板的员工视图）

var fs = require('fs');
var base = require('./base.js');
var EmployeeList = require('../collections/employeecollection.js');
var employeeService = require('../services/employeeService.js');
var template = fs.readFileSync('app/templates/employee.mu', { encoding: 'utf8' });


module.exports = base.extend({
  el: '.view',
  template:template,
  collection: employeeService.collection,

  initialize: function () {
    this.viewModel = {
      employee_list: this.collection.toJSON()
      //employee_list: this.collection.fetch() --HERE I EXPERIMENTED WITH FETCHING THE DATA
    };
    this.render();
  }
});

employeeservice.js（服务文件夹中的文件，理想情况下会返回我将绑定到他们员工视图文件中的模板的集合）

var EmployeeCollection = require('../collections/employeecollection.js');

//if wanting to pass in data manually
var employee_list = [
    {
        id:1,
        firstName:"James",
        lastName:"King",
        fullName:"James King",
        managerId:0,
        managerName:"",
        title:"President and CEO",
        department:"Corporate",
        cellPhone:"617-000-0001",
        officePhone:"781-000-0001",
        email:"jking@fakemail.com",
        city:"Boston, MA",
        pic:"james_king.jpg",
        twitterId:"@fakejking",
        blog:"http://coenraets.org"
    }
];

//HERE I WAS EXPERIMENTING WITH A DIFFERENT SYNTAX TO DO THE FILTERING BY ID
//IN MY SERVICE AND SIMPLY RETURNING THE FINAL DATA I WANT TO MY VIEW CLASS

// var employees = new EmployeeCollection({id: id});

//  employees.fetch({
//      success: function (data) {
//          console.log(data);
//      }
//  });


module.exports = {
  collection: new EmployeeCollection(employee_list)
};

Answer 1

Backbone 用于 RESTful 服务。

我将尝试使用一些易于理解的术语来解释基础知识。

所以主干是基于模型和视图的。

模型对数据负责。 这意味着，模型是从服务器获取数据并存储它的模型。 在交互式应用程序中，模型应该具有url 或urlRoot 属性，它们指示该模型所引用的特定资源的 url 是什么。 例如，如果我们有一个 Person 资源，并假设我们正在使用标准的 RESTfult 服务，我会期待与此类似的东西：

var Person = Backbone.Model.extend({
    url :   'http://localhost:3000/api/Person'
});

这实际上让我们可以创建该模型的新实例并对其进行操作。 该 url 将被模型用于与其相关的所有 CRUD 操作。

例如，如果我们现在创建一个新实例：

var person = new Person();

我们现在有以下基本的 CRUD 操作：

fetch：此方法在后台执行异步 AJAX GET 请求，并将数据注入模型。 现在，在我们获取数据后，我们可以通过简单地调用get 来使用它： person.get('name'); * 假设有 name 属性。

save此方法正在后台执行异步 AJAX POST 或 PUT 请求。 如果模型的idAttribute未定义，则执行POST，否则执行PUT。 idAttribute 是一个模型属性，它指示模型的唯一 id 是什么。

示例用法：

person.set({name : 'Mor'});
person.save();

abvoe 将在请求正文中执行带有name: 'Mor' 的发布请求。 例如，如果我获取了模型，并且已经分配了 idAttribute，则调用相同的 save 方法将使用 PUT 请求。

destroy此方法将在后台执行DELETE 请求。 示例用法：person.destroy();。

显然，我刚刚向您展示了基本用法，还有更多选择。

集合只是一个模型列表，所以没有太多要解释的，你可以在这里阅读更多：http://backbonejs.org/#Collection

视图就是您所看到的一切。它是应用程序的视觉部分。 Backbone 让我们做的是将视图绑定到模型和集合。 这样，我们就可以创建一些动态的内容和视觉效果。

基本视图应该是这样的：

var PersonView = Backbone.View.extend({
  el: '.person',
    initialize: function(){
    this.listenTo(this.model, "change", this.render);
  },
  render: function(){
    this.$el.html("hello :"+this.model.get("name"));
  }
});

如您所见，我使用了listenTo。它是一个事件监听器，每次模型更改时都会调用render。 当我引用 this.model 时，我指的是一个模型，当我启动它时，我将传递给视图：

var view = new View({ model : person});

这样，由于我使用了listenTo，我的视图现在与person 模型绑定。

基本上就是这样。 显然，还有很多需要学习和理解，但这几乎涵盖了基础知识。

请参考http://backbonejs.org/并阅读更多信息。