ember模板中的动态类

Question

我从Angular开始使用Ember.js（我正在尝试和学习不同的框架）。 有人可以解释一下如何在Ember模板中创建动态类吗？ 我已经阅读了文档，但我必须说它对我来说仍然有点模糊。

这就是我想要做的事情：

<div class="myClass-{{id}}></div>

{{id}} 等同于json中的item id。 我不知道它是否有帮助，但我也使用Ember View作为该模板。

感谢您的时间和谢谢！

Answer 1

我不确定为什么你会想要这样做'可以'通过正常的{{bind-attr}}帮助

<div {{bind-attr class=someProperty}}></div>

如果数据是通过用户操作生成的。然后在动作的接收器中（在控制器中），您可以执行以下操作：

someAction: function(id){
 this.set('someProperty', 'class-' + id);
}

如果它处于加载状态，您可以通过路径中的model挂钩或setUpController挂钩填充该属性

模型钩：

model: function(){
 return {someProperty: 'class-' + id}; //where ever id is coming from
}

setupController hook：

setupController: function(controller, model){
  controller.set('someProperty', 'class-' + id); //where ever id is coming from
}

修改

在您的视图中回调：

didInsertElement: function(){
  var _scope = this;
  var cb = function(){
    _scope.get('controller').set('someProperty', 'class-' + id);
  }
  //set up jquery countdown
}

为了安全起见，如果你在jquery中做一些倒计时触发器，它将不会进入Ember的runloop，所以你可能会看到一些奇怪的行为。考虑使用run详细here