属性 'element' 在类型 'Directive' 上不存在。ts

Question

我遇到错误属性 'element' 在 'directive' 上不存在。我在这里尝试创建指令功能。

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

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

  constructor(element: ElementRef) {
    element.nativeElement.style.backgroundColor = 'brown';
    element.nativeElement.style.fontSize = '38px';
  }

  @HostListener('mouseenter') onmouseenter() {
    this.highlight('red');
  }
  @HostListener('mouseleave') onmouseleave() {
    this.highlight('yellow');
  }

  private highlight(color: string) {
    this.element.nativeElement.style.backgroundColor = color;
  }

}

Answer 1

您的构造函数参数目前只能在构造函数内部访问，您需要添加以下访问修饰符关键字之一：private、protected、public 或 readonly 使其成为 class 字段：

constructor(readonly element: ElementRef) {}

Answer 2

class 名称应不同于 Directive

export class CustomDirective{ }

并且在构造函数中进行初始化时，您必须指定访问修饰符，例如 public、private 等，以便在 class 的任何方法中使用它们。

属性 'element' 在类型 'Directive' 上不存在。ts

Property 'element' does not exist on type 'Directive'.ts

angular

angular5