首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

如何禁用所有来自ngFor的按钮,除了在angular 8中被点击的按钮

在Angular 8中,可以通过以下步骤禁用除当前被点击按钮外的所有ngFor生成的按钮:

  1. 在组件的HTML模板中,使用ngFor指令生成按钮,并为每个按钮添加一个点击事件处理函数,例如:
代码语言:txt
复制
<button *ngFor="let item of items; let i = index" (click)="onClickButton(i)" [disabled]="isButtonDisabled(i)">
  {{ item }}
</button>
  1. 在组件的Typescript文件中,定义一个变量来跟踪当前被点击的按钮的索引,并创建一个函数来判断按钮是否应该被禁用,例如:
代码语言:txt
复制
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函数在按钮被点击时将被点击的按钮的索引赋值给clickedButtonIndexisButtonDisabled函数用于判断按钮是否应该被禁用,如果按钮的索引与clickedButtonIndex不相等,则返回true,否则返回false

这样,除了当前被点击的按钮,其他由ngFor生成的按钮都会被禁用。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

没有搜到相关的合辑

领券