8

我有一个控制器，其中包含有关用户帐户（图标、名称、提供者等）的数据。在每个循环的输出中，我有一个视图，它将根据通过该特定模型传入的提供程序动态构建一个 CSS 类。

<script type="text/x-handlebars" data-template-name="accountItem">
{{#each account in controller}}
    {{#view App.AccountView}}
        <h4>{{account.name}}</h3>
        <img {{bindAttr src="account.icon"}} />
        <i {{bindAttr class="account.provider"}}></i>
    {{/view}}
{{/each}}
</script>

App.AccountView = Ember.View.extend({
    tagName: 'a',
    classNames: ['avatar-image'],
    providerClass: function(el) {
        // do something
    }
});

我有两个问题。

  1. 您如何将“帐户”或当前迭代的项目传递到视图中？
  2. 传入之后，怎么引用呢？

我敢肯定这是经常发生的事情，但我似乎找不到任何例子。任何人都可以提供一些意见吗？

4

2 回答 2

11

Views 在视图中有一个特殊的content属性，它允许使用更简单的方法：您只需使用模型属性的名称而不使用view.content.部件。
此外，当您在控制器上进行迭代时，您可以省略循环变量的名称并使用this，就像在本指南中一样。这不是必需的，但可以使代码更简洁。
此外，从视图的模板中，您通常不需要引用外部变量，但如果您愿意，您可以这样做。

{{#each controller}}
    {{#view App.IndexView contentBinding="this"}}
        <h4>{{name}}</h4>
        <img {{bindAttr src="icon"}} />
        <i {{bindAttr class="provider"}}></i>
        <i> {{icon}} </i>
        <i>{{provider}}</i>
    {{/view}}
{{/each}}

您始终可以通过以下content方式从视图中访问该属性：

this.get('content');
于 2013-02-28T11:39:10.027 回答
2

当前迭代的项目可以通过属性绑定传递到视图中，在模板中可以称为“{{view.property}}”。例如：

{{#each account in controller}}
     {{#view App.IndexView itemBinding="account"}}
            <h4>{{view.item.name}}</h3>
            <img {{bindAttr src="account.icon"}} />
            <i {{bindAttr class="account.provider"}}></i>
              <i> {{view.item.icon}} </i>
              <i>{{view.item.provider}}</i>
        {{/view}}
{{/each}}

我为上述情况创建了一个简单的 jsfiddle。请检查它并让我知道您是否能够解决问题。

小提琴网址：http: //jsfiddle.net/nCyn6/3/

于 2013-02-26T09:21:09.420 回答