输出页面的多个部分

问题描述

index.html：

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

application.js

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

我有一部分页面，我有一些Ember交互 - 用户输入一些值和一个计算结果显示。

I have a section of a page where I have some Ember interactions - a user inputs some values and a calculated result is displayed.

我现在想将计算结果显示在页面的另一部分外部的定义模板之外，我该如何实现？ p>

I now want to have the calculated result displayed in another part of the page that is outside the defined template, how would I accomplish this?

推荐答案

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

You could bind that property to the application controller and then use it anywhere you want in the application. For example:

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

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

Now you can use it anywhere within the application you want. Just tell the outlet's controller to need the application controller, then call that property in the template. Like so:

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

在 Foo 模板中：

{{controllers.application.indexResult}}

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

Or, if you are within the application scope you can just do:

{{indexResult}}

这篇关于输出页面的多个部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！