Я создал простую директиву, которая работает в демонстрационном приложении под углом, согласно приведенному здесь руководству.
Директива appHighlight работает в Angular, но ничего не делает при применении в новом пустом приложении Ionic-v4.
Вот шаги, которые я предпринял для создания этого ионного проекта:
- Директива ионного запускаТест бланка - type = angular
- Директива по ионному генерированию. Выделить
- импортировал ElementRef из «@ angular / core» и вставил в
Конструктор HighlightDirective, как показано ниже.
- set ElementRef.nativeElement.style.backgroundColor = "желтый" внутри
директивный конструктор
- проверено, чтобы убедиться, что HighlightDirective был объявлен в
app.module.ts добавил appHighlight для тега в home.page.html
Ожидается ли, что это будет работать, как показано, или я что-то упустил? Спасибо!
highlight.directive.ts:
import { Directive, ElementRef } from '@angular/core';
@Directive({
selector: '[appHighlight]'
})
export class HighlightDirective {
constructor(el: ElementRef) {
el.nativeElement.style.backgroundColor = 'yellow';
}
}
app.module.ts:
@NgModule({
declarations: [AppComponent, HighlightDirective],
entryComponents: [],
imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule],
providers: [
StatusBar,
SplashScreen,
{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
],
bootstrap: [AppComponent]
})
export class AppModule {}
home.page.html:
<ion-content padding>
The world is your oyster.
<p appHighlight> test </p>
</ion-content>