问题：

Question

问题：

我正在尝试创建一个可以在单个表单元素以及表单顶部显示错误消息的表单。

我希望能够将错误存储在模型之外的某处。默认情况下，如果我没有弄错，只有模型属性包含在模板中。所以我试图使用模板助手添加错误。到目前为止，它不起作用并打破以下错误：

Uncaught ReferenceError: errors is not defined

视图：

var LoginFormView = Marionette.ItemView.extend({
  // some view properties
  ...

  errors: [],
  templateHelpers: function() {
    console.log('LoginFormView.templateHelpers',this, this.errors);
    var output = {};
    if(this.errors.length) {
      output.errors = this.errors;
    }
    return output;
  },

  initialize: function(currentUser, options) {
    // some initialization
    ...

    this.bindTo(this.model, "loadUser:fail", this.onLoadUserFail, this);
  },

  ...

  onLoadUserFail: function() {
    alert('Access Denied!');
    this.errors.push('Your login credentials are invalid. Please try again.');
    this.render();
  }
});

LoginFormView对象只是一个模块定义。它稍后会被实例化并注入Backbone.Marionette.Region。我不确定这与我遇到的问题有什么关系，但我想我会提到它以防万一。

模板：

<script type="text/template" id="login-form-template">
  <form class="form-vertical well well-shadow span4">

    ...

    <% if(errors) { %>
      <fieldset class="alert alert-error">
        <button type="button" class="close" data-dismiss="alert">×</button>
        <legend>Oops!</legend>
        <ul>
          <% _.each(errors, function(error) { %>
            <li><%= error %></li>
          <% }); %>
        </ul>
      </fieldset>
    <% } %>

    ...

  </form>
</script>

似乎错误无法进入模板，因为错误会在模板中抛出：

<% if(errors) { %>

查看Backbone.Marionette源代码我的印象是templateHelpers方法被执行，其输出与“data”对象（序列化模型）合并。

如果是这种情况，为什么我可以访问我的模型的属性，但'errors'属性是未定义的？

解决方案：

joverson非常友好地指出了这个问题。我的新templateHelpers方法现在如下所示：

errors: [],
templateHelpers: function() {
  console.log('LoginFormView.templateHelpers', this, this.errors);
  var output = {};
  output.errors = this.errors;
  return output;
},

Answer 1

当此视图通过带有show()的木偶区域显示时，它将在您的视图almost immediately上调用render()方法。由于在视图的errors数组中包含项目之前，模板数据的errors属性不会被填充，因此模板中将未定义errors。

如果删除了对错误的检查并且只是通过一个空数组，因此至少定义了它，你应该能够在模板中进行存在检查以获得相同的效果。

Backbone.Marionette TemplateHelpers：访问存储在模型外部的数据

问题：

视图：

模板：

解决方案：

1 个答案: