Ionic/Angular中如何获取@NgModule的声明类与提供者列表

在Ionic/Angular项目里，要拿到@NgModule里的declarations、providers这类元数据，Angular本身没有直接暴露this.ngModule.declarations.getClasses()这样的API，但我们可以通过两种可靠的方式实现：

方法一：使用反射（Reflect）获取元数据 #

这种方法需要启用TypeScript的装饰器元数据发射，步骤如下：

1. 首先确保你的tsconfig.json里开启了emitDecoratorMetadata：

{
  "compilerOptions": {
    // 其他配置...
    "emitDecoratorMetadata": true
  }
}

2. 在你的AppModule中，通过Reflect.getMetadata直接读取@NgModule的注解配置：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { MyApp, AuthPage, HomePage } from './pages';

@NgModule({
  declarations: [MyApp, AuthPage, HomePage],
  imports: [BrowserModule],
  bootstrap: [MyApp]
})
export class AppModule {
  constructor() {
    // 获取@NgModule的注解元数据
    const ngModuleAnnotation = Reflect.getMetadata('annotations', AppModule)[0];
    
    // 获取declarations列表
    const declaredClasses = ngModuleAnnotation.declarations;
    console.log('Declarations:', declaredClasses); // 输出 [MyApp, AuthPage, HomePage]
    
    // 同理获取providers（如果有的话）
    const providedClasses = ngModuleAnnotation.providers;
    console.log('Providers:', providedClasses);
  }
}

方法二：使用Angular Compiler服务（官方推荐，无需反射） #

这种方法依赖Angular的Compiler服务，不需要开启额外的TypeScript配置，而且更贴合Angular的内部机制：

import { NgModule, Compiler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { MyApp, AuthPage, HomePage } from './pages';

@NgModule({
  declarations: [MyApp, AuthPage, HomePage],
  imports: [BrowserModule],
  bootstrap: [MyApp]
})
export class AppModule {
  constructor(private compiler: Compiler) {
    // 获取当前模块的工厂对象
    const moduleFactory = this.compiler.getModuleFactory(AppModule);
    
    // 访问Angular内部生成的模块元数据（ɵmod是内部属性，不同版本可能略有变化）
    const moduleMetadata = moduleFactory.moduleType['ɵmod'];
    
    // 提取declarations对应的类
    const declaredClasses = moduleMetadata.declarations.map(item => item.type);
    console.log('Declarations:', declaredClasses); // 输出 [MyApp, AuthPage, HomePage]
    
    // 提取providers（需要区分是类还是注入令牌）
    const providedItems = moduleMetadata.providers.map(item => item.type || item.token);
    console.log('Providers:', providedItems);
  }
}

注意事项 #

• 方法一中的Reflect依赖ES6的反射API，如果你的项目需要兼容旧浏览器，可能需要引入core-js的polyfill。
• 方法二中的ɵmod是Angular的内部API，虽然在稳定版本中变化不大，但如果追求绝对的长期兼容性，方法一更稳妥。

内容的提问来源于stack exchange，提问作者Yegor