ember.js - 将负 isDirty 与禁用类连接

Question

有没有办法重构以下代码以使其更干净，或者是{{#if}}解决这个问题的最干净的方法？

{{#if isDirty}}
  <button {{action 'save' this}} class="btn">Save</button>
  <button {{action 'discard' this}} class="btn">Discard</button>
{{else}}
  <button class="btn disabled">Save</button>
  <button class="btn disabled">Discard</button>
{{/if}}

Answer 1

我更喜欢用 CSS 解决这个问题：

<button {{bindAttr class=":btn content.isDirty:enabled:disabled"}}>Save</button>

您可以在禁用时使用 CSS 来防止点击（如果您的目标浏览器支持它）。或者只是让点击通过，只有在 content.isDirty 时才调用提交/回滚。

另一种选择是绑定按钮的禁用属性：

<button {{bindAttr disabled="content.isDirty:enabled:disabled"}}>Save</button>