角度手风琴 - 当`is-open`已经在使用时，`isFirstOpen`

Question

不确定如何写这个问题。当我需要两个is-open时我该怎么办？

我尝试添加is-open两次（<accordion-group is-open="status.open" is-open="status.isFirstOpen" is-disabled="status.isFirstDisabled">因为我希望第一个在加载时打开。但是因为我使用了is-open两次它没有用。

然后我尝试了<accordion-group is-open="status.open || status.isFirstOpen" is-disabled="status.isFirstDisabled">这也行不通。

这是一个羽毛http://plnkr.co/edit/EYBHLXYCuAZbJwparO6u?p=preview

所以，顶级手风琴组现在还没有工作，我试图让它在页面加载时打开。但实际上我想彻底消除那个顶级手风琴乐队，并且只有下面的动态手风琴组，但是第一个动态手风琴在页面加载时打开。我现在被困在如何继续前进。

<div ng-controller="AccordionDemoCtrl">
  <accordion close-others="oneAtATime">
    <accordion-group is-open="status.open || status.isFirstOpen" is-disabled="status.isFirstDisabled"
        <accordion-heading><i class="glyphicon-plus"></i>
            I can have markup, as well! <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.open2, 'glyphicon-chevron-right': !status.open2}"></i>
        </accordion-heading>
        This is just some more content to illustrate fancy headings.
    </accordion-group>

    <accordion-group is-open="status.open2" ng-repeat="group in groups">
        <accordion-heading><i class="glyphicon-plus"></i>
           {{group.title}}<i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': status.open, 'glyphicon-chevron-right': !status.open}"></i>
        </accordion-heading>
       {{group.content}}
    </accordion-group>

  </accordion>
</div>

Answer 1

http://plnkr.co/edit/wEoyhKK4h0aslEdcGSJY?p=preview

将 $scope.groups = [ { title: 'title 1', content: 'content 1', isOpen: true }, { title: 'title 2', content: '<li>Content 2</li>' }, ... ]; 添加到列表中的第一项

  <div ng-controller="AccordionDemoCtrl">
    <accordion close-others="oneAtATime">

      <accordion-group is-open="group.isOpen" ng-repeat="group in groups">
        <accordion-heading><i class="glyphicon-plus"></i> {{group.title}}
          <i class="pull-right glyphicon" ng-class="{'glyphicon-chevron-down': group.isOpen, 'glyphicon-chevron-right': !group.isOpen}"></i>
        </accordion-heading>
        {{group.content}}
      </accordion-group>

    </accordion>
  </div>

然后将您的HTML更改为：

<div class="row">
<div class="col-md-6 form-group">[input field "your name"]</div>
<div class="col-md-6 form-group">[checkbox "yes/no"]</div>
</div>

http://plnkr.co/edit/wEoyhKK4h0aslEdcGSJY?p=preview