Question

我有以下观点：

App.MessageTrayView = Bootstrap.AlertMessage.extend({
    message: 'This is a message.',
});

在此模板中显示：

  <script type="text/x-handlebars" data-template-name="nodes">
    <article>
      <form class="form-horizontal">
        <fieldset>

          {{view App.MessageTrayView id="message-tray-view"}}

          <div id="legend" class="">
            <legend class="">Nodes&nbsp;&nbsp;&nbsp;<span class="badge">{{controllers.nodesIndex.length}} records</span>
            <div class="pull-right">
              <a {{action destroyAllRecords}}><i class="icon-remove-circle"></i><a/>
              {{#linkTo "nodes.new" class="btn btn-primary"}}Add Node{{/linkTo}}
            </div>
            </legend>
          </div>

          {{outlet}}

        </fieldset>
      </form>
    </article>
  </script>

这个无关的控制器：

App.NodesIndexController = Ember.ArrayController.extend({
    destroyAllRecords: function () {
        console.log('destroyAllRecords called');
        App.MessageTrayView.set('message', 'All nodes have been deleted');
    },
});

我想在触发destroyAllRecords后立即更改显示的消息。这不起作用（控制台中的错误消息告诉我，我正在做某事*非常*错误）。如何更改message属性，以便在页面上直接显示更改？

您可以看到实时代码here

Answer 1

这样做的一种快捷方法是在App命名空间上定义属性：

App = Ember.Application.create({
  messageTrayContent: ''
});

然后在您的视图中使用后缀Binding在您的属性名称后绑定到它：

App.MessageTrayView = Bootstrap.AlertMessage.extend({
  messageBinding: 'App.messageTrayContent'
});

正在做：

App.NodesIndexController = Ember.ArrayController.extend({
  destroyAllRecords: function () {
    console.log('destroyAllRecords called');
    App.set('messageTrayContent', 'All nodes have been deleted');
  },
});

应该有用。

希望它有所帮助。

从不相关的控制器更改视图属性

1 个答案: