Директива объявлена ​​и экспортирована из основного модуля, но не запускает Angular 7

Question

Привет всем, я возобновлю свою проблему в нескольких словах. Я создал директиву в своей папке Core Module и добавил ее в объявления и экспортировал в такой модуль. Этот модуль реализован в модуле приложения (основной модуль). Я использую декоратор директивы на моей странице индекса (эта страница объявлена ​​в другом модуле страницы модуля) все хорошо, я не получаю никакой ошибки, но логика директивы не запускается.

Я попытался объявить директиву в модуле страницы и она работает. Также что-то очень любопытное, если удалить директиву из модуля ядра, она выдает ошибку. Не удается определить модуль для класса HasfunctionalityDirective, который является правильным

Директива

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

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


  constructor(
    private elem: ElementRef,
    private renderer: Renderer2
  ) { 
    this.renderer.setStyle(this.elem.nativeElement, 'color', 'blue');
  }
}

Основной модуль

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HasfunctionalityDirective } from './directives/hasfunctionality.directive';


@NgModule({
  declarations: [
    HasfunctionalityDirective
  ],
  imports: [
    CommonModule,
  ],
  exports: [
    HasfunctionalityDirective
  ]
})
export class CoreModule { }

Модуль приложения

import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { CoreModule } from './core/core.module';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    CoreModule,
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

Index.html

<p appHasfunctionality>
  index works!
</p>

В этом случае элемент 'p' должен изменить цвет на синий.

Как видите, модуль приложения получает все элементы ядра, а angular не выдает никакой ошибки, но логика не срабатывает.

Answer 1

Нашел решение моей проблемы, я объявил модуль на верхнем слое (основной) вместо того, чтобы перейти к модулю страниц, потому что я понимаю, что это единственное место, которое используется.

Answer 2

Вы можете получить ссылку только на элемент в afterviewinit. попробуйте это

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

@Directive({
  selector: '[appHasfunctionality]'
})
export class HasfunctionalityDirective implements AfterViewInit {


  constructor(
    private elem: ElementRef,
    private renderer: Renderer2
  ) { 
  }

  ngAfterViewInit() {
    this.renderer.setStyle(this.elem.nativeElement, 'color', 'blue');
  }
}