Question

我有7个按钮。其中之一是“编辑”按钮。在单击smb之前，必须禁用除Edit以外的所有内容。我怎样才能做到这一点？我想为所有按钮编写一个功能。可能吗？我是AngularTs的新手。

  <button class="btn btn-outline-primary " type="button">Edit</button>

    <button   class="btn btn-outline-primary " type="button">Assign</button>
    <button class="btn btn-outline-primary  " type="button">Start</button>
    <button class="btn btn-outline-primary " type="button">Resolve</button>
    <button class="btn btn-outline-primary " type="button">Ready for test</button>
    <button class="btn btn-outline-primary " type="button">ReOpen</button>
    <button class="btn btn-outline-primary " type="button">Close</button>

Answer 1

https://stackblitz.com/edit/angular-6dmgon

请参阅上面的stackblitz。

为此，我在“编辑”按钮上创建了一个click事件。

  <button class="btn btn-outline-primary " (click)="changeEditable()" type="button">Edit</button>

    <button   class="btn btn-outline-primary " [disabled]="btnDisabled" type="button">Assign</button>
    <button class="btn btn-outline-primary  " [disabled]="btnDisabled" type="button">Start</button>
    <button class="btn btn-outline-primary " [disabled]="btnDisabled" type="button">Resolve</button>
    <button class="btn btn-outline-primary " [disabled]="btnDisabled" type="button">Ready for test</button>
    <button class="btn btn-outline-primary " [disabled]="btnDisabled" type="button">ReOpen</button>
    <button class="btn btn-outline-primary " [disabled]="btnDisabled" type="button">Close</button>

此更改btnDisabled会影响模板中按钮的位置。

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: [ './app.component.css' ]
})
export class AppComponent  {
  name = 'Angular';
  btnDisabled = false;

  changeEditable() {
    console.log('changeEditable')
    this.btnDisabled = !this.btnDisabled;
  }
}

如何通过在Typescript上单击另一个来启用按钮？

1 个答案: