0

我无法弄清楚如何从服务器填充模型的属性，然后将填充的模型添加到集合并让该集合由视图呈现。这是我的代码：

var movieDetails = new cinephile.Models.MovieDetailsModel({ id: movie.get('id') });
this.collection.add(movieDetails);

MovieDetailsModel 内部：

cinephile.Models.MovieDetailsModel = Backbone.Model.extend({

    url: function()
    {
        return '/cinephile/api/index.php?action=getMovieDetails&movieId=' + this.id;
    },

    initialize: function()
    {
        this.fetch();
    }
});

并且this.collection只是一个模型集的集合cinephile.Models.MovieDetailsModel

我正在监听要添加到集合中的项目，当它们出现时，将执行以下操作：

displayMovie: function(movie)
{
    var view = new cinephile.Views.MovieView({
        model: movie,
        className: 'movie clearfix',
        template: JST['app/scripts/templates/MovieView.ejs'],
    });

    this.$("#my-movies").append(view.el);
},

电影视图看起来像这样：

cinephile.Views.MovieView = Backbone.View.extend({

    initialize: function(options)
    {
        this.template = options.template;
        this.render();
    },

    render : function()
    {
        this.$el.html(this.template(this.model.attributes));
        return this;    
    },
});

我遇到的问题是我正在使用的模板试图访问未定义的模型属性。我很确定它是未定义的，因为在将模型添加到集合并随后渲染到视图之前 MoveDetailsModel 尚未完成获取。

我该如何解决这个问题？我希望能够创建一个接受 id 的 MovieDetailsModel，使用该 id 从服务器获取电影详细信息，然后将填充的模型添加到集合中，然后将该集合呈现到屏幕上。

任何帮助表示赞赏。

4

1 回答 1

1

Backbone fetch返回一个jqXHR对象，这是一个 Deferred objects Promise。调用 fetch 时，尚未填充属性。Promise 对象有一个 don ejqXHR 函数，一旦请求完成，就可以在其中传递回调以执行。

我建议将 fetch 移到另一个方法而不是构造函数中，因为在那里您可以返回 jqXHR 对象并访问它的 done 函数。这是一个例子：

var movieDetails = new cinephile.Models.MovieDetailsModel({ id: movie.get('id') });
var promise = movieDetails.fetch();
promise.done(function() {
    var view = new cinephile.Views.MovieView({model: movieDetails});
    view.render();
});
于 2013-09-04T06:33:53.417 回答