Включить / отключить кнопку, создав пользовательскую директиву под углом 6

Question

Необходимо динамически включать / отключать несколько кнопок на нескольких страницах HTML на основе условий, например, Active = true, затем включить кнопку, а если Active = false, то отключить кнопку.Как создать и применить пользовательскую директиву.

Answer 1

Возможно что-то вроде этого:

.ts

import { NgControl } from '@angular/forms';

@Directive({
  selector: '[disableControl]'
})
export class DisableControlDirective {

  @Input() set disableControl( condition : boolean ) {
    const action = condition ? 'disable' : 'enable';
    this.ngControl.control[action]();
  }

  constructor( private ngControl : NgControl ) {
  }

}

html:

<button [disableControl]="condition">Button 1</button>
<button [disableControl]="condition">Button 2</button>
<button [disableControl]="condition">Button 3</button>

condition будет логическим значением в вашем компоненте, которое будет отключать / включать управление при необходимости.

Источник: https://netbasal.com/disabling-form-controls-when-working-with-reactive-forms-in-angular-549dd7b42110