1

问题：

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

我希望能够将错误存储在模型之外的某个地方。默认情况下，如果我没记错的话，模板中只包含模型属性。所以我正在尝试使用模板助手添加错误。到目前为止，它不起作用并因以下错误而中断：

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 方法被执行，并且它的输出与“数据”对象（序列化模型）合并。

如果是这样的话，我怎么能访问我的模型的属性，但“错误”属性是未定义的？

解决方案：

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

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

1 回答 1

2

当这个视图通过 Marionette Region 显示时，它几乎show()会立即调用render()视图上的方法。由于在视图的数组中有项目之前不会填充模板数据的属性，因此将在模板中未定义。errorserrorserrors

如果您删除错误检查并只传递一个空数组以便至少定义它，您应该能够在模板中进行存在检查以获得相同的效果。

于 2012-07-24T21:49:33.423 回答