ember 在每个循环的输入值中计算答案

【问题标题】：ember computed in input value from each loopember 在每个循环的输入值中计算
【发布时间】：2017-04-05 09:03:24
【问题描述】：

我在 ember 上有一个输入元素，而值来自每个条件

{{#each items as |item|}}
        <div class="form-group">
          <label class="col-sm-3 control-label">Judul {{item.no}}</label>
          <div class="col-sm-9 input-group">
            {{input class="form-control" value=item.title placeholder="Tambah judul" type="text"}}
            <span class="input-group-btn">
              <a class="btn btn-default remove_detail" type="button" onclick={{action 'decreaseTitle'}}><i class="fa fa-times"></i></a>
            </span>
          </div>
        </div>
{{/each}}

我只是想“观看”而 value=item.title 中的输入已从 ember 计算中更改。该怎么做？

【问题讨论】：

你能否更好地解释这个问题，我真的不明白。无论如何，您可能应该在 item.title ==> {{item.title}} 周围加上括号
看完item.title的变化你打算怎么办？

标签： javascript ember.js handlebars.js ember-components ember-controllers

【解决方案1】：

请参阅下面的twiddle 以了解依赖于数组中项的属性的计算属性定义的说明。你可以查看application.js控制器。

Ember.computed('items.@each.title', function(){...})

为您解决问题。

【讨论】：

【解决方案2】：

如果你想动态观察数组内部的某些东西，最好使用组件来包装这些逻辑：

{{#each items as |item|}}
        <div class="form-group">
          <label class="col-sm-3 control-label">Judul {{item.no}}</label>
          <div class="col-sm-9 input-group">
            {{my-input item=item}}
            <span class="input-group-btn">
              <a class="btn btn-default remove_detail" type="button" onclick={{action 'decreaseTitle'}}><i class="fa fa-times"></i></a>
            </span>
          </div>
        </div>
{{/each}}

这里，my-input 将是您的具有这些逻辑的组件，并且在组件的 .js 文件中，

computedProperty: Ember.computed('item.title', {
  //your logics goes here...
};

在组件的模板文件中，

{{input class="form-control" value=item.title placeholder="Tambah judul" type="text"}}

以及任何其他必须绑定的逻辑都可以在组件的范围内实现

@rakwaht, item.title 不需要用大括号括起来，因为它位于另一个帮助器（输入）中

【讨论】：