如何在AngularJS Bootstrap UI Accordion状态下使用ng显示元素

How to display an element with ng-show based on AngularJS Bootstrap UI Accordion state?

本文关键字：ng 元素 显示 状态 Accordion AngularJS Bootstrap UI      更新时间：2023-09-26

我有一些基于$resource的动态手风琴，如下所示：

$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>

有了上面的内容，我默认情况下会打开第一个按钮，这正是我想要的，但只有当手风琴打开时，我才想显示上面的按钮。因为$first是ng-repeat的特殊变量，我无法更改它。我试过像这样使用isOpen：

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

但这也没用。我怎样才能做到这一点？请记住手风琴是以动态内容为基础的。

非常感谢。

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

您可以使用ng init-ie: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>
相关文章：