如何使用指令启用角度4中的禁用按钮 [英] how to use directives to enable a disabled button in angular 4

问题描述

我如何使用指令启用禁用的按钮.例如

How can i use directives to enable a disabled button. For example

这是我的html代码

    <button appHighlight >Increment</button>
    <button appHighlight disabled>decrement</button>

这是我的指令appHighlight.我希望当我单击增加"按钮时，我的减少"按钮被启用.

Here appHighlight is my directive. I want that when i click increment button my decrement button gets enabled.

这是我的指令代码.我想为此使用主机列表器.我不知道该怎么做.

Here is my directive code. I want to use host listner for this. I don't know how to do this.

     import { Directive, ElementRef, HostListener } from 
    '@angular/core';


   @Directive({
   selector: '[appHighlight]',

     })
   export class HighlightDirective {


  constructor(private el: ElementRef ) { }
  numberOfClicks = 0;
   showMainContent: Boolean = true;

   @HostListener('click', ['$event'])
   ShowHideButton(btn) {
    console.log('button', btn, 'number of clicks:', 
    this.numberOfClicks++);

   }
   }

推荐答案

我不确定您的指令代码是什么样的. 您可以改用angular属性禁用.

I'm not sure what your directives code looks like. You could use the angular property for disabled instead.

<button appHighlight (click)="incrementClicked = true">Increment</button>
<button appHighlight [disabled]="incrementClicked">decrement</button>

这篇关于如何使用指令启用角度4中的禁用按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！