Ionic 自定义指令被 Angular 忽略

Question

我在 ionic 中创建了自定义指令

ionic g directive directives/time-value

我的密码是

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

@Directive({
    selector: '[appTimeValue]',
})
export class TimeValueDirective implements OnInit{

    @Input('appTimeValue') myStyles: any;

    constructor() { 
      console.log("I'm here");
    }
    ngOnInit(): void {
      console.log("I'm here");
  
    }
}

然后我尝试使用指令

<ion-input type="text" name="fineColazione" [(ngModel)]="fineColazione" appTimeValue></ion-input>

Ionic 忽略了我的指令。

CLI 在模块声明中添加了指令

@NgModule({
  declarations: [
    AppComponent,
    TimeValueDirective,
  ],
  entryComponents: [],
  imports: [
    CommonModule,
    BrowserModule, 
    IonicModule.forRoot(), 
    AppRoutingModule,
    FormsModule
  ],
  providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
  bootstrap: [AppComponent],
})
export class AppModule {}

如何使指令生效？

Answer 1

TimeValueDirective 应该在与包含使用该指令的组件的模块相同的模块中声明。在应用程序内部制作具有所有可重用 components/directives/pipes 的 SharedModule 并在任何地方导入此模块也是一个好习惯。

Ionic 自定义指令被 Angular 忽略

Ionic custom directive is Ignored by Angular

directive

ionic-framework

angular