Question

如何解析响应值.. 我想从json值获取json值....但在解析时遇到问题....

var ListView = Backbone.View.extend({
    el: '#app-container',

    initialize: function() {
        _.bindAll(this,"render");
        console.log('ListView init.');
        this.counter = 0;
        this.collection = new FieldCollection();
        this.collection;
        this.render(this.collection);
    },

    events: {
        'click #add': 'addItem'
    },

   render: function(val) {
        console.log(val);
        console.log('Render called.');

    },
});

我的json如下......

[
{
    "name": "qqqqqqqqqqqqqqqqqqq",
    "img": "qqqqqqqqqqqqqqqqqqqq"
},
{
    "name": "eeeeeeeeeeeeeeeeeee",
    "img": "eeeeeeeeeeeeeeeeeee"
},
{
    "name": "ggggggggggggggggggg",
    "img": "gggggggggggggggggggg"
}
]

我的问题是如何解析响应值......

如何在视图中访问json值...

var FieldCollection = Backbone.Collection.extend({
    defaults: {
        model: Field
    },
    model: Field,
    url: 'http://localhost:8080/backbonejs/myjsoncollection.json',
    initialize: function() {
        console.log('FieldCollection init.');
    },
    parse: function(response) {
      console.log(response);
      return response;
    }
});

这是整个代码......

$(function(){

var Field = Backbone.Model.extend({
    defaults: {
        name: "shaleen",
        img: "not found",
    },
    initialize: function() {
       // console.log(this.attributes.name);
    }
});
 var FieldCollection = Backbone.Collection.extend({
    defaults: {
        model: Field
    },
    model: Field,
    url: 'http://localhost:8080/backbonejs/myjsoncollection.json',
    initialize: function() {
        console.log('FieldCollection init.');
    },
/*  parse: function(response) {
      console.log(response);
      return response;
    }*/
});

var ListView = Backbone.View.extend({
    el: '#app-container',
    initialize: function() {
        _.bindAll(this,"render");
        console.log('ListView init.');
        this.counter = 0;
        var jsonfield = new FieldCollection();
        jsonfield.fetch();
        this.render(jsonfield);
    },
   render:function(collection){
        _.each(collection, function(model){
            console.log(model.get('name'));
        });

        _.each(function(model){
            console.log(model.get('name'));
            console.log(model.get('img'));
        },this);
    }
});

var listView = new ListView();

}）;

Answer 1

解析函数是可选的，如果从服务器收到数据后发生任何特殊情况，您只需要实现它。为了隔离可能的错误来源，我将首先通过不连接到您的服务器来简化您的方法。请运行以下代码：

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

var FieldCollection = Backbone.Collection.extend({
    model: Field,
});

var ListView = Backbone.View.extend({
    el: '#app-container',

    initialize: function() {
        this.collection = new FieldCollection();
        this.collection.add([{name:'name1',img:'img1'},{name:'name2',img:'img2'}]);
        this.render(this.collection);
    },

    render(collection){
        collection.each(function(model){
            console.log(model.get('name')+' '+model.get('img'));
    },this);
});

如果此方法有效，请应用以下2项更改：

更改集合以包含网址：

var FieldCollection = Backbone.Collection.extend({
    model: Field,
    url='http://localhost:8080/backbonejs/myjsoncollection.json'
});

更改View的初始化函数以执行获取：

initialize: function() {
    this.collection = new FieldCollection();
    this.collection.fetch();
    this.render(this.collection);
},

如果适用于扩展版本，请先运行简化版本。

解析+ backbonejs

1 个答案: