在Angular 8中,可以通过以下步骤禁用除当前被点击按钮外的所有ngFor生成的按钮:
<button *ngFor="let item of items; let i = index" (click)="onClickButton(i)" [disabled]="isButtonDisabled(i)">
{{ item }}
</button>
export class YourComponent {
items: string[] = ['Button 1', 'Button 2', 'Button 3'];
clickedButtonIndex: number;
onClickButton(index: number) {
this.clickedButtonIndex = index;
}
isButtonDisabled(index: number): boolean {
return index !== this.clickedButtonIndex;
}
}
在上述代码中,items
是一个包含按钮文本的数组。clickedButtonIndex
变量用于跟踪当前被点击的按钮的索引。onClickButton
函数在按钮被点击时将被点击的按钮的索引赋值给clickedButtonIndex
。isButtonDisabled
函数用于判断按钮是否应该被禁用,如果按钮的索引与clickedButtonIndex
不相等,则返回true
,否则返回false
。
这样,除了当前被点击的按钮,其他由ngFor生成的按钮都会被禁用。
领取专属 10元无门槛券
手把手带您无忧上云