javascript - 如何根据 AngularJS Bootstrap UI Accordion 状态使用 ng-show 显示元素？

Question

我有一些基于 $resource 的动态 Accordion ，如下所示:

$scope.categories = $resource.query() // Written as such for simplicity sake

然后在我的模板中我有以下内容:

<accordion-group ng-repeat="category in categories" is-open="$first">
    <accordion-heading>
        <button ng-show="IDontKnow">...</button>
        ...
    </accordion-heading>
</accordion>

通过上述内容，我默认第一次打开，这就是我想要的，但是我想仅在 Accordion 打开时才显示上面的按钮。因为 $first 是来自 ng-repeat 的特殊变量，所以我无法更改它。我尝试像这样使用 isOpen :

<button ng-show="category.isOpen">...</button>

但这也不起作用。我怎样才能实现这个目标？请记住， Accordion 是基于动态内容的。

提前非常感谢。

Answer 1

请参阅此处http://plnkr.co/edit/rv6esLxJuE6NLlxwhZkh?p=preview

你可以使用ng-init，即:ng-init="category.isOpen=$first"

HTML:

   <accordion close-others="oneAtATime">

  <accordion-group ng-repeat="category in categories" is-open="category.isOpen" ng-init="category.isOpen=$first">
    <accordion-heading>
      I can have markup, too!
      <button ng-show="category.isOpen">I'm the button</button>
    </accordion-heading>
    This is just some content to illustrate fancy headings.
  </accordion-group>
</accordion>