Javascript 如何绑定<；细节>；元素'；余烬中的打开属性是什么？

我有一些入职步骤是工作流程的一部分。这些步骤包含在一个

元素中，我在它们第一次访问时默认打开了该元素。要关闭“详细信息”面板，用户可以单击一个按钮确认他们理解了步骤，或者只需单击

元素，这是详细信息元素的默认行为

<details open={{not isOnboarded}}>
  <summary>Getting Started</summary>
  <p>some steps about getting started</p>

  <button type="button" {{action 'completeOnboarding'}}>I Understand</button>
</details>

开始
关于开始的一些步骤

我理解

不幸的是，由于

元素本机切换

打开

属性，它似乎正在删除Ember的绑定

如何绑定Ember中打开的详细信息？

Ember将状态（

isOnboarded

）存储在内存中，并在状态更改时重新呈现DOM。但是，Ember不会检查DOM以协调状态。注意，这并不是Ember的限制，大多数js框架也是这样工作的。DOM的不断协调在计算上是不可行的

您可以阻止默认行为，并改为使用余烬进行切换

controller.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  isOpen: true,
  actions: {
    toggleDetails () {
        this.toggleProperty('isOpen')
    },
    onNativeToggle (e) {
      // e here is the native HTMLEvent
      e.preventDefault()
      this.send('toggleDetails') // triggers the 'toggleDetails' action
    }
  }
});

<details open={{isOpen}} onclick={{action 'onNativeToggle'}}>
  <summary>Copyright 1999-2014.</summary>
  <p> - by Refsnes Data. All Rights Reserved.</p>
  <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>

<button onclick={{action 'toggleDetails'}}> Click to Toggle via Ember </button>

模板.hbs

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  isOpen: true,
  actions: {
    toggleDetails () {
        this.toggleProperty('isOpen')
    },
    onNativeToggle (e) {
      // e here is the native HTMLEvent
      e.preventDefault()
      this.send('toggleDetails') // triggers the 'toggleDetails' action
    }
  }
});

<details open={{isOpen}} onclick={{action 'onNativeToggle'}}>
  <summary>Copyright 1999-2014.</summary>
  <p> - by Refsnes Data. All Rights Reserved.</p>
  <p>All content and graphics on this web site are the property of the company Refsnes Data.</p>
</details>

<button onclick={{action 'toggleDetails'}}> Click to Toggle via Ember </button>

版权1999-2014。
-根据参考数据。版权所有

本网站上的所有内容和图形均为公司参考数据的财产

单击以通过余烬切换

---

余烬旋转：

我一直在玩，看起来很棘手。您可以这样做，但不使用

而使用余烬可能更容易。