Как включить кнопку, нажав другую на Typescript? - PullRequest
Новая
       17

Как включить кнопку, нажав другую на Typescript?

0 голосов
/ 19 мая 2019

У меня 7 кнопок.Одним из них является кнопка редактирования.Все, кроме «Правка», должны быть отключены до того, как кто-то нажмет на нихКак я могу это сделать?Я хочу написать одну функцию для всех кнопок.Является ли это возможным?Я новичок в 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>

1 Ответ

1 голос
/ 19 мая 2019

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

См. Стекирование выше.

Для этого я создал событие нажатия на кнопку редактирования. 

  <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;
  }
}
...