angular - 如何动态添加垫扩展面板?
问题描述
我无法以编程方式添加 mat-expansion-panel。当用户通过单击按钮调用函数时,我想添加它们。根据需要多次添加扩展面板。
我尝试为 mat-expansion 添加 HTML 标签,这是一种非常不正确的尝试方法。它只是添加标签并忽略组件。
解决方案
您可以将 mat-expansion-panel 数据添加到数组 (matExpansionPanelArray) 中,然后使用 *ngFor:
<mat-accordion>
<mat-expansion-panel *ngFor="let item of items;">
<mat-expansion-panel-header>
<mat-panel-title>{{item.title}}</mat-panel-title>
<mat-panel-description>{{item.description}}</mat-panel-description>
</mat-expansion-panel-header>
<mat-form-field>{{item.formField}}</mat-form-field>
</mat-expansion-panel>
</mat-accordion>
因此,如果您将数据动态添加到“matExpansionPanelArray”,页面上将出现一个新的 mat-expansion-panel
推荐阅读
- ios - 谷歌签名我 didSignInFor。我的 ID 令牌已过期
- sql-server - 具有多个事实表连接到一个维度表的模式
- python - Matplotlib Colorbar 将不同的 bin 分配给自定义颜色条?
- firebase - 颤动如何显示所有文档的子集合?
- powershell - 带有 Poweshell ExchangeOnlineManagement 模块的 Azure Docker 容器
- wordpress - 为什么我的子域重定向到我的主域
- javascript - 如何通过单击另一个组件中的图标打开折叠栏?
- azure-synapse - 自动暂停和恢复 Azure 突触分析数据库
- java - Oracle ADF 11g - 将 pdf 传递到打印队列
- javascript - 向 OpenLayers-Map 添加额外的 WMS'