0

这是我的模板：

<table id="locationDataTable" class="large-data-table" cellspacing='0' border='0'>

  <thead>
    <tr>
      <th>
        {{view App.LocationDataTable type='kwh'}}
      </th>
      <th>
        {{view App.LocationDataTable type='btu'}}
      </th>
    </tr>
  </thead>
  <tbody>
     ...
  </tbody>
</table>

这是我的观点 JS：

App.LocationDataTable = Ember.View.extend({
  tagName: 'span',
  classNames: ['carrot'],
  classNameBindings: ['direction', 'isActive:active'],
  direction: 'down',
  isActive: false,

  click: function(){

    // remove active class from all #locationDataTable span

    this.set('isActive', true);  // set active only on this one

    var type = this.get('type');
    this.get('controller').set('sortProperties', [type]);

    if (this.get('direction') === 'up') {
      this.set('direction', 'down');
      this.get('controller').set('sortAscending', true);
    } else {
      this.set('direction', 'up');
      this.get('controller').set('sortAscending', false);
    }
  }
});

我不知道我是否以最好的方式这样做......我尝试像{{action 'sortTable'}}以前一样使用动作助手并且遇到了类似的问题......我可以为每个元素设置不同的视图 js，但是，我将如何删除活动的他们所有人的课？

如果我没有很好地解释自己，请告诉我。

4

1 回答 1

0

我猜你有某种ArrayController管理你的对象列表。也许像App.LocationsController. 像这样的东西应该工作。

App.LocationsController = Ember.ArrayController.extend({
  selectNone : function(){
    this.get('content').forEach(function(location){
      location.set('isActive',false); 
    });
  }
});

App.LocationDataTableController = Ember.Controller.extend({
  needs : ['locations']
});

App.LocationDataTable = Ember.View.extend({
  // your other stuff here...
  click: function(){

    // remove active class from all #locationDataTable span
    this.get('controller.controllers.locations').selectNone();

    this.set('isActive', true);  // set active only on this one

    // your other stuff here...
  }
});
于 2013-09-05T06:48:53.967 回答