3

Ember.Routerによって作成されたコントローラーがあり、これによりテーブルにデータが入力されます。

テンプレート:

{{#each key in controller}}

  {{#view App.TestView contentBinding="key"}}

  <tr {{bindAttr class="view.isSelected"}} {{action selectKey this on="click" target="view" }}>
    <td>{{key.id}}</td>
    <td><button type="button" class="btn btn-danger" {{action removeKey on="click" target="view"}}>Remove</button></td>
  </tr>

  {{/view}}

{{/each}}

背後にあるコード:

App.TestView = Em.View.extend({
  removeKey: function () {
    var key = this.get('content');
    this.bindingContext.removeObject(key);
    return false;
  },
  selectKey: function (event) {
    this.set('theClass', 'warning');
  },
  theClass: 'selectable',
  isSelected: function () {
    return this.get('theClass');
  }.property('theClass')
});

onclickイベントによってクラスが「warning」に変更され、コレクション内の行が黄色で強調表示されることを期待していますが(cssクラスのように)、これは発生しません。isSelectedプロパティはDOMを更新していないようで、なぜ更新されないのかわかりません。

ここのJsfiddle:http: //jsfiddle.net/EsF4R/114/

4

1 に答える 1

2

Metamorphとテーブル構造の間に衝突があると思います。ビューにタグ<tr>を付け、<td>要素にクラスバインディングを配置すると、結果のhtmlがまだ奇妙だと思っていても(特に<script x-start>and <script x-end>) 、それが機能するように見えます。

ここで変更されたフィドルを参照してください:http://jsfiddle.net/Sly7/EsF4R/126/

編集

これは、見栄えの良い一致するタグを使用したフィドルです。http://jsfiddle.net/Sly7/EsF4R/129/ さらに、必要な動作に固執します。つまり、クラスバインディングを処理し、tr要素の代わりに要素をクリックします。td

于 2012-11-09T21:53:07.610 に答える