如何在视图中插入模型获取的结果

时间:2012-07-19 15:14:14

标签: backbone.js

fetch()是服务器的模型,我想用视图呈现fetch()的结果。

fetch()的结果是一个对象数组(var risultati),我希望渲染这个var risultati。我已经尝试但没有任何作用。

var AppRouter = Backbone.Router.extend({
    routes: {
        "": "list",
    },
    initialize: function () {},
    list: function () {
        var utente = new Person();
        var risultati;
        utente.fetch({
            success: function (data) {
                var ris = data.attributes;
                var risultati = ris.results;
                console.log(risultati); /* risultati contains array of object to render*/
            }
        });
        this.page = new UserListView({
            model: this.utente
        });
        $('body').append(this.page.$el);
    }
});

2 个答案:

答案 0 :(得分:1)

您可能遇到问题,因为您提出的视图调用与您的utente.fetch()电话分开进行。

由于.fetch()是异步的,因此您的视图代码将在.fetch()完成之前执行。您应该将视图创建/呈现添加为成功函数的一部分,或者应该绑定更新模型时发生的更改事件以触发包含视图创建的新函数。

答案 1 :(得分:0)

你应该将MVC逻辑分开......不要将对象(我认为的集合)附加到路由器路由处理程序 假设您正在尝试渲染人物模型的集合,我建议您使用模型和视图来处理人员和集合以及处理“对象数组”的视图:

var Person = Backbone.Model.extend({
        initialize : function(){
            // initialize the view
            this.view = new PersonView({model : this}); 
        }
    }),
    PersonView = Backbonke.View.extend({
        render : function(){
            // render your person
        }
    }),
    UserList = Backbone.Collection.extend({
        model : Person,
        initialize : function(){
             this.view = new UserListView({
                  collection : this
             });
        },
        update : function(){
            var self = this;
            this.fetch({
                success: function (data) {
                    var ris = data.attributes;
                    var risultati = ris.results;
                    console.log(risultati); /* risultati contains array of object to render*/                self.view.render();
                 }
            });
        }
    }),
    UserListView = Backbone.View.extend({
        render : function(){
            this.collection.each(function(el,i){
                el.view.render();
            });
        }
    });

然后将其用作:

 var page = new UserList();
 var AppRouter = Backbone.Router.extend({
    routes: {
        "": "list",
    },
    initialize: function () {},
    list: function () {
        page.update();
    }
});

希望这有帮助!