在ng重复中创建的弹出窗口可以通过以下步骤来关闭:
以下是一个示例代码:
在HTML模板中:
<div *ngFor="let item of items">
<!-- ng重复中的其他内容 -->
<div *ngIf="item.showPopup" class="popup">
<!-- 弹出窗口的内容 -->
<button (click)="closePopup(item.id)">关闭</button>
</div>
</div>
在组件中:
export class YourComponent {
items = [
{ id: 1, showPopup: true },
{ id: 2, showPopup: true },
{ id: 3, showPopup: true }
// 其他ng重复的数据
];
closePopup(id: number) {
const item = this.items.find(item => item.id === id);
if (item) {
item.showPopup = false;
}
}
}
在上述示例中,ngFor指令用于循环创建多个弹出窗口,每个弹出窗口都有一个唯一的ID和一个控制显示与隐藏的变量showPopup。通过点击关闭按钮,调用closePopup函数,并传入对应的ID,可以关闭对应的弹出窗口。
请注意,这只是一个示例,具体实现方式可能因项目的具体情况而有所不同。在实际开发中,可以根据具体需求选择适合的方式来关闭ng重复中创建的弹出窗口。
领取专属 10元无门槛券
手把手带您无忧上云