如何从 emberjs 中的组件向 div 添加类？

Question

我有这个main-navbar组件。

app /templates/components/main-navbar.hbs文件如下所示：

<ul>
    <li>Home</li>
    <li>Blog</li>
</ul>
<button> Add class </button>

当我单击按钮时，我希望ul元素接收测试类<ul class='test'>，当我再次单击按钮时，测试类将被删除。

我怎样才能实现按钮的这个动作？我假设必须使用app/components/main-navbar.js文件。

Answer 1

您应该查看指南的这一部分，它描述了如何准确执行此操作。如果您的组件具有 tagName：'ul'，则只需使用 classNameBindings 绑定到属性。

export default Ember.Component.extend({
  classNameBindings: ['test'],
  test: false,
  actions:{
    toggled(){
      this.toggleProperty('test')
    }
  }
});

啊等等，您正在另一个元素上设置类，现在添加它。

class="{{if somethingEnabled 'test' 'empty'}}"

这是一个实现的问题。