PrimeNG手风琴展开所有/折叠所有



我正在寻找一种方法来打开和关闭整个手风琴一个按钮。现在我是这样做的。目前只有扩张有效,但由于某种原因,崩溃不起作用。我核对了一下,结账了。selected在折叠时被设为False,但不会关闭

openCloseAllProjectStatusTabs(requestToOpen: boolean) {if (this.projectStatusTabs !== undefined && this.projectStatusTabs != null){this.projectStatusTabs.forEach(tab => tab.selected = requestToOpen);this.expanded = requestToOpen;}}

我没有测试这段代码,但我认为你所需要的是给p-accordionmultiple标志。然后你所需要做的就是一个单独的isExpanded值,它将使用selected输入来控制所有的制表符。

app.component.html

<p-accordion [multiple]="true">
<p-accordionTab header="Header 1" [selected]="isExpanded">
<p>
Content 1
</p>
</p-accordionTab>
<p-accordionTab header="Header 2" [selected]="isExpanded">
<p>
content 2
</p>
</p-accordionTab>
<p-accordionTab header="Header 3" [selected]="isExpanded">
<p>
content 3
</p>
</p-accordionTab>
</p-accordion>
<button (click)="isExpanded = !isExpanded">Toggle</button>

app.component.ts

@Component({
selector: 'app-root',
templateUrl: './app.component.html'
})
export class AppComponent { 
private _isExpanded = false;

public get isExpanded() {
return this._isExpanded;
}
public set isExpanded(value: boolean) {
this._isExpanded = value;
}
}

最新更新