Question

我在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计算变化。怎么做？

Answer 1

请参阅以下twiddle以获取依赖于数组中项目属性的计算属性定义的说明。您可以查看Array ( [0] => S1 E22 [1] => S2 E22 [2] => S3 E22 [3] => S4 E3 )控制器。

application.js

为你做的伎俩。

Answer 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不需要用大括号括起来，因为它在另一个帮手（输入）里面

ember从每个循环的输入值计算

2 个答案: