渲染页面时未分配 falseys 的 Ember 类属性答案

【问题标题】：Ember class attributes for falseys are not being assigned when rendering page渲染页面时未分配 falseys 的 Ember 类属性
【发布时间】：2014-12-28 17:48:59
【问题描述】：

渲染页面时未分配用于 falseys 的 Ember 类属性。我有两个按钮元素是/否。非活动按钮有一个呈现不透明度的类：.3 那工作正常。但是，我需要在这些按钮上设置默认行为，以便在呈现页面时“是”处于非活动状态。应该很简单，我只是相应地设置了属性。但是它没有为 false 值添加适当的类。

希望很清楚我要做什么以及问题所在。感谢您的宝贵时间。

我做了一个JSbinhttp://jsbin.com/vixayatuda/1/edit?html,css,js,output

window.App = Ember.Application.create();

App.ApplicationController = Em.Controller.extend({
  takingTrade: false,

  actions: {
    makeTrade: function() {
      this.set('takingTrade', true);
    },
    makeNotTrade: function() {
      this.set('takingTrade', false);
    }

  }
});


<script type="text/x-handlebars">
  <button {{action 'makeTrade' this}} class="btn btn-success" {{bind-attr class="takingTrade::inactive"}}>YES</button>
  <button {{action 'makeNotTrade'}} class="btn btn-success" {{bind-attr class="takingTrade:inactive"}}>NO</button>
  <p>{{takingTrade}}</p>
</script>

【问题讨论】：

标签： javascript css ember.js

【解决方案1】：

ember 文档 (http://emberjs.com/guides/templates/binding-element-class-names/#toc_static-classes) 声明

绑定类名和静态类名不能合并。

因此，您的“是”按钮应如下所示：

<button {{action 'makeTrade' this}} {{bind-attr class="takingTrade::inactive :btn :btn-success"}}>YES</button>

查看完整示例here

【讨论】：