为什么AngularJS多级手风琴在数据更新上崩溃？

Question

我需要一个基于AngularJS的多层次手风琴从后端绑定一个树状数据结构，我遇到了这个https://github.com/LukaszWatroba/v-accordion。

它运行得很好，只是每次在控制器中更新数据时，它都会完全崩溃(关闭任何扩展的子手风琴)。我在控制器中有一个计时器，它在特定的时间间隔(例如，每3分钟)调用后端来池数据。我不知道这是否是手风琴的内置行为，但如果是，这怎么能被修复呢？

如有任何建议/帮助，将不胜感激。

Answer 1

解析

我联系了这个插件的作者Łukasz Wątroba，在他的友好帮助下，我能够解决这个任务。如果有人有类似的目标，我想和大家分享他的反馈。

解决方案:在JSON数据结构中需要添加两个属性，1)窗格的"id“，2)窗格"isExpanded”的状态- true/false

这两个属性是专门为前端设计的，以维护您可能与之交互过的任何窗格的展开折叠状态。

  [
    {
      id: 'pane-1b',
      isExpanded: true,
      .................
      all your initial properies...
      .....................
    },
    {
      id: 'pane-2b'',
      isExpanded: false
      .................
      all your initial properies
      .....................
    },
    {
      id: 'pane-3b,',
      isExpanded: false
      .................
      all your initial properies
      .....................

      subpanes: [
        {
          id: 'subpane-1b',
          isExpanded: false
          .................
          all your initial properies
          .....................
        },
        {
          id: 'subpane-2b',
          isExpanded: false
          .................
          all your initial properies
          .....................
        }
      ]
    }
  ]

HTML将具有以下结构，其中“窗格”是JSON数据。

<v-pane id="pane.id" ng-repeat="pane in panes" expanded="pane.isExpanded">
    .................
     <!--For multi level HTML you would have a nested ng-repeat-->

     <v-pane id="subpane.id"  ng-repeat="subpane in pane.subpanes"    expanded="subpane.isExpanded">
     </v-pane>
    .............
</v-pane>