如何在 Backbone.Collection 中传递变量而不是 url

How to pass variable instead of url in Backbone.Collection

我尝试在不使用 url 的情况下将我的数据传递到 Backbone.Collection。我只有一个对象数组的响应,我需要的是将一个变量传递给 url。但是 url 是工作目录中到 json 文件或 url 到服务器的路径。那么我怎样才能传递我的变量而不是 url?

    var test = [{
        "name": "Afghanistan",
        "url": "http://en.wikipedia.org/wiki/Afghanistan",
        "pop": 25500100,
        "date": "2013-01-01",
        "percentage": 0.36,
        "id": 1
    }, {
        "name": "Albania",
        "url": "http://en.wikipedia.org/wiki/Albania",
        "pop": 2831741,
        "date": "2011-10-01",
        "percentage": 0.04,
        "id": 2
    }];

    var Territory = Backbone.Model.extend({});

    var Territories = Backbone.Collection.extend({
        model: Territory,
        url: "scripts/test.json" // there should be pass to my variable "test" 
    });

您可以覆盖fetch方法并将数据设置到这个方法中。

var testMocks = [/* ... */];

var Territory = Backbone.Model.extend({});
var Territories = Backbone.Collection.extend({
    model: Territory,
    url: testMocks, // there should be pass to my variable "test" 

    fetch: function(options) {
        var options = options || {};
        var response = this.url;

        // Do the same as the fetch method does when the data received
        this.set(this.parse(response, options), options);

        if (typeof options.success === 'function') {
            options.success(this, response, options);
        }

        // Returns deferred as the original fetch
        return Backbone.$.Deferred().resolve();
    },
});

// ...

var collection = new Territories();
collection.fetch();

console.log(collection.length); // 2
console.log(collection.first().get('name')); // "Afghanistan"

如果你也想使用 save/destroy 方法(例如测试),你可以使用 sinon fake server.

您可以使用 initialize: 函数。你可以这样做。

var Territories = Backbone.Collection.extend({
    model: Territory,
    initialize: function(options) {
        this.id = options.id;
        this.url = options.url;
    },
    url: function(){
        return this.url+'/'+this.id;
    }   

});
var collection = new Territories({id: 125, url: 'http://anything.somthing'})
collection.fetch();

您需要阅读更多 backbone 文档。 http://backbonejs.org/

正如 在评论中暗示的那样,如果您想从值数组而不是 URL 初始化集合,您只需将值数组传递给集合的构造函数即可。这些值应该传达与集合期望从服务器获得的 JSON 相同的结构。

根据你的代码,我只需要添加:

var territories = new Territories(test);
console.log(territories.at(0).attributes);
console.log(territories.at(1).attributes);

这里有一段说明。当你 运行 它时,你会在控制台上看到存储在集合中的第一个和第二个模型的属性。

var test = [{
  "name": "Afghanistan",
  "url": "http://en.wikipedia.org/wiki/Afghanistan",
  "pop": 25500100,
  "date": "2013-01-01",
  "percentage": 0.36,
  "id": 1
}, {
  "name": "Albania",
  "url": "http://en.wikipedia.org/wiki/Albania",
  "pop": 2831741,
  "date": "2011-10-01",
  "percentage": 0.04,
  "id": 2
}];

var Territory = Backbone.Model.extend({});

var Territories = Backbone.Collection.extend({
  model: Territory,
  url: "scripts/test.json" // there should be pass to my variable "test" 
});

var territories = new Territories(test);
console.log(territories.at(0).attributes);
console.log(territories.at(1).attributes);
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.3.3/backbone-min.js"></script>