angular - 如何使用角度更改鼠标输入的文本颜色

Question

我是编程新手。我已经尝试过这段代码，但@hostlistner 部分不起作用我使用了引导程序版本 4

它也没有给出任何编译错误

 element.nativeElement.style.color = 'red' 

该声明有效，但

 this.element.nativeElement.style.color = 'blue';

这个没有

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

         @Directive({
          selector: '[setmycolor]'
           })
          export class SetmycolorDirective {

          constructor(private element:ElementRef) {
          element.nativeElement.style.color = 'red';
          }


          @HostListener('onmouseenter')onMouseEnter(){
          this.element.nativeElement.style.color = 'blue';
          }

          }

应用程序中的代码

Answer 1

试试下面：

监听事件的名称是mouseenter，而不是onmouseenter。希望你明白了。:)

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

         @Directive({
          selector: '[setmycolor]'
           })
          export class SetmycolorDirective {

          constructor(private element:ElementRef) {
          element.nativeElement.style.color = 'red';
          }


          @HostListener('mouseenter') onMouseEnter(){ //SEE HERE
          this.element.nativeElement.style.color = 'blue';
          }

          }

Answer 2

您的代码是正确的，只需将onmouseenter替换为mouseenter

@HostListener('mouseenter') onMouseEnter(){
          this.element.nativeElement.style.color = 'blue';
          }