Свойство 'element' не существует для типа 'Directive'.ts

Question

Я сталкиваюсь с ошибкой, свойство 'element' не существует в 'директиве'.Здесь я пытаюсь создать функциональность директив.

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

Имя класса должно отличаться от Directive

export class CustomDirective{ }

, и во время инициализации в конструкторе необходимо указать такие модификаторы доступа, как public, private и т. Д., Чтобыиспользуйте их в любом методе этого класса.

Answer 2

Ваш параметр конструктора доступен только внутри конструктора, вам нужно добавить одно из следующих ключевых слов модификаторов доступа: private, protected, public или readonly, чтобы сделать его полем класса:

constructor(readonly element: ElementRef) {}