App.Module 导入不适用于 Ionic 页面答案

【问题标题】：App.Module imports not working on Ionic pagesApp.Module 导入不适用于 Ionic 页面
【发布时间】：2022-08-17 18:03:26
【问题描述】：

我正在创建一个我想在我的页面上使用的指令，但是每当我将某些内容导入 app.module 时，它就好像页面不是 app.module 的子级一样。如果我将指令直接导入页面模块，它会起作用并且文本会突出显示。有没有办法让我的页面成为 app.module 的子页面，或者我是否需要创建一个单独的模块来存储我的所有页面？

app.module.ts

    import { NgModule } from \'@angular/core\';
    import { BrowserModule } from \'@angular/platform-browser\';
    import { RouteReuseStrategy } from \'@angular/router\';
    
    import { IonicModule, IonicRouteStrategy } from \'@ionic/angular\';
    
    import { AppComponent } from \'./app.component\';
    import { AppRoutingModule } from \'./app-routing.module\';
    import {HttpClientModule} from \'@angular/common/http\';
    
    import { HighlightDirective } from \'./highlight.directive\';
    
    
    @NgModule({
      declarations: [AppComponent, HighlightDirective,],
      imports: [BrowserModule, IonicModule.forRoot(), AppRoutingModule, HttpClientModule],
      providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
      bootstrap: [AppComponent],
    })
    export class AppModule {}

parentpage.page.html

 <ion-header>
      <ion-toolbar>
        <ion-title>parentpage</ion-title>
        <ion-buttons slot=\"end\">
          <ion-back-button defaultHref=\"home\"></ion-back-button> 
       </ion-buttons>
      </ion-toolbar>
    </ion-header>
    
    <ion-content>
      <ion-text color=\"primary\">
        <h2>Welcome</h2>
      </ion-text>
      <p appHighlight>Highlight me!</p>
    </ion-content>
    
    <ion-header collapse=\"fade\" [translucent]=\"true\">
      <ion-toolbar>
        <ion-title>Header</ion-title>
      </ion-toolbar>
    </ion-header>

标签： angular ionic-framework

【解决方案1】：

我认为您必须创建另一个模块并将所有必需的导入/导出保留在那里，并将该模块导入 app.module.ts 本身。

按照这个：sharing modules

【讨论】：