如何使用Ngfor默认打开Nebular Accordion

Question

我使用Angular 7的最新Nebular版本，在使用星云手风琴时遇到问题。问题：默认情况下，活动的手风琴应该扩展而不是全部，我尝试使用expand = true但是所有手风琴都扩展了，这不是用例。

<nb-accordion>
    <nb-accordion-item *ngFor="let list of lists" expanded =true >
        <nb-accordion-item-header>
            {{list.name}}
        </nb-accordion-item-header>
        <nb-accordion-item-body >
            <ul >
                <li *ngFor="let item of list.category" [value]="item.id" 
                [ngClass]="{'active': item.id == categoryId}">
                    <div class="col-9">{{item.name}}</div>
                </li>
            </ul>
        </nb-accordion-item-body>
    </nb-accordion-item>
</nb-accordion>

Answer 1

如果您需要扩展特定元素，可以在qazxsw poi数组中移动扩展标志，如下所示：

lists

然后将其用作

  lists = [
    {
      name: 'Test',
      expanded: false,
    },
    {
      name: 'Test 2',
      expanded: true,
    },
  ];

属性值：

expanded

在这里你去

<nb-accordion>
    <nb-accordion-item *ngFor="let list of lists" [expanded]="list.expanded">
        <nb-accordion-item-header>
            {{list.name}}
        </nb-accordion-item-header>
        <nb-accordion-item-body >
            Hello
            World
        </nb-accordion-item-body>
    </nb-accordion-item>
</nb-accordion>