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

时间:2016-10-18 13:07:02

标签: backbone.js backbone-collections

我尝试在不使用Backbone.Collection的情况下将数据传递到url。我只是对一组对象做出响应,我需要的是将变量传递给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" 
    });

3 个答案:

答案 0 :(得分:1)

您可以覆盖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"

如果您还想使用保存/销毁方法(例如测试),您可以使用sinon fake server

答案 1 :(得分:0)

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

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();

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

答案 2 :(得分:0)

正如mu is too short在评论中暗示的那样,如果要从值数组而不是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>