2

有人可以检查以下代码并告诉我为什么我不能将模型中的任何属性输出到模板吗？我的视图和模板正确呈现模型确实获取数据，这应该可以工作......

模板：

Name should show here --> {{thisItem}}

我没有收到错误和文字显示，但没有{{thisItem}}。通过阅读文档，这应该可以。

我认为我的模型没有被传递给模板，或者是否需要 [dot] 即 {{model.name}}？

我的观点：

define([
    'jquery',
    'underscore',
    'backbone',
    'models/myModel',
    'collections/myModelCollection',
    'hbs!templates/testExampleTemplate.html',
], function ($, _, Backbone, myModel, myModelCollection, testExampleTemplate) {
    var thisView = Backbone.Marionette.ItemView.extend({
        initialize: function (options) {
            this.model.fetch();
        },
        model: new myModel(),
        template: testExampleTemplate,
    });
    return thisView;

});

模型的 console.log 显示我确实有数据：

    attributes: Object
          thisItem: "Example Item"

模型：

define([
    'underscore',
    'backbone',
    'jquery'
], function (_, Backbone, jquery) {

    var myModel = Backbone.Model.extend({
        urlRoot: '/myModel'
    });

    return myModel;

});

模板，这就是我的工作方式：

HTML 基础

布局视图被加载到这个即

function (Marionette, Handlebars, template, jquery, model) {
    var LayoutView = Backbone.Marionette.Layout.extend({
        template: template,
        regions: {
            holder1: "#holder1"
        }
    });
    return LayoutView;
});

<div id="holder1">I will be replaced</div>

然后有问题的视图被加载到 holder1 中。

4

1 回答 1

5

这是一个异步问题。change您需要在渲染之前收听模型的事件。

尝试添加

modelEvents: {
    'change': 'render'
}

到你的观点。这将确保您的模型在视图呈现之前已加载其数据，以便您的数据显示在您的模型中。

顺便说一句，modelEvents是 Marionette 特有的，而不是 Backbone 原生的。你可以这样做：

var self = this;
this.model.fetch({'success': function() {
    self.render();
});

如果你想单独依赖 Backbone，在你的初始化函数中。

这是有效的，因为您的模型不会立即从服务器加载其数据。这需要一点时间，您的代码会继续执行。因此，您在数据加载之前进行渲染。通过等待它加载，您可以确保模板将与数据一起呈现。您可以从任何地方删除您的其他渲染调用，因为视图现在正在渲染自己。旁注，这将允许它在数据自动更改时重新呈现。

于 2013-11-14T22:17:10.077 回答