Question

是否可以从backbone.js视图中使用未在相关Backbone.js模型中定义的变量呈现underscore.js模板？

发现can't find variable: username错误。

要呈现的模板：

<div class="content" id="content">               
<div id="form">
    <form action="">
        <input id="username" type="text" placeholder="Username" name="username" value= <%=username%> >
        <input id="password" type="password" placeholder="Password" name="password" >
        <ul class="table-view">
            <li class="table-view-cell">
                Remember me
                <div class="toggle active">
                    <div class="toggle-handle"></div>
                </div>
            </li>
        </ul>
        <button id="logbtn" class="btn btn-primary btn-block">Login</button>
    </form>    

<button id="renregbtn" class="btn btn-positive btn-block">Register</button>
</div>
</div>

从视图中渲染线条：

this.$el.html( this.template_login( this.loginModel ) );

行形成loginModel模型文件：

define([
    'underscore',
    'backbone',
    ],
    function(_, Backbone) {
        var LoginModel = Backbone.Model.extend({

            urlRoot: '/login',
            initialize: function(){
                this.fetch();
            },
        });

        return LoginModel;
});

我手动设置模型。但仍然采取无法找到变量错误，如第一个渲染情况。

以上相同型号：

define([
    'underscore',
    'backbone',
    ],
    function(_, Backbone) {
        var LoginModel = Backbone.Model.extend({

            urlRoot: '/login',
            defaults: {
                username: "abc",
            },
            initialize: function(){
                this.fetch();
            },
        });

        return LoginModel;
});

两种情况都会导致：

ReferenceError: Can't find variable: username

只有当我将一个硬编码的模型json提供给template_login时才有效。

this.$el.html( this.template_login(  {username: "Joe"} ) );

Answer 1

这里的问题有两个地方。在模型代码和渲染视图代码中：

首先，模型应该定义模板中使用的变量，至少默认为null。

其次，在视图中呈现代码应该在同一视图中定义的模板函数中提及模型的属性，而不仅仅是模型。

像这样：

首先，

模型文件中的

：

defaults: {
            username: "",//or alternately username: null,
        },

第二

视图文件中的

：

this.$el.html( this.template_login( this.loginModel.attributes ) );

Answer 2

我不认为在默认值中定义变量就足够了，我之前遇到过这个问题，例如模型中的计算字段在inialize方法中我写道：

 initialize : function() {
            this.set({
                "calculatedField" : this.calculateField()
            });
},
calculateField:function(){
       //calculate your field or return it directly
 }

然后你可以在你的模板中正常使用calculatedField，如果它不是一个计算字段，那么它应该在你的模型中，就像其他服务返回的其他字段一样，例如

使用模板中未定义的模板变量渲染Backbone.js视图

2 个答案: