javascript - 在页面的多个部分中输出

index.html：

<div id="section_a">
  <script type="text/x-handlebars" data-template-name="index">
    First value: {{input type="text" value=one}}<br>
    Second value: {{input type="text" value=two}}<br>
    Result: {{result}}
  </script>
</div>
<div id="section_b">
  <!-- Display {{result}} here aswell -->
</div>

application.js

App.IndexController = Ember.ObjectController.extend({
  one: 0,
  two: 0,
  result: function() {
    return this.get('one') + this.get('two');
  }.property('one', 'two')
});

我在页面的某个部分中有一些Ember交互-用户输入一些值并显示计算结果。

现在，我想让计算结果显示在页面的已定义模板之外的另一部分中，我该怎么做？

最佳答案

您可以将该属性绑定到应用程序控制器，然后在应用程序中所需的任何位置使用它。例如：

App.ApplicationController = Ember.ObjectController.extend({
  needs: ['index'],
  indexResult: Ember.computed.alias('controllers.index.result')
});

现在，您可以在所需的应用程序中的任何位置使用它。只需告诉出口商的控制器需要应用程序控制器，然后在模板中调用该属性即可。像这样：

App.FooController = Ember.ArrayController.extend({
  needs: ['application'],
  //...
});

在Foo模板中：

{{controllers.application.indexResult}}

或者，如果您在应用程序范围内，则可以执行以下操作：

{{indexResult}}

关于javascript - 在页面的多个部分中输出，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/24853897/