Angular 中declarations，imports，providers，exports的用法？-Toy模板网

这篇具有很好参考价值的文章主要介绍了Angular 中declarations，imports，providers，exports的用法？。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

在Angular中，declarations、imports、providers和exports是NgModule（模块）装饰器中的关键配置项，用于定义和配置Angular应用的模块。每个模块在应用中扮演不同的角色，以下是它们的主要用法：

declarations（声明）：

declarations 数组中列出了当前模块中所有属于这个模块的组件、指令和管道。
所有在 declarations 中列出的组件、指令和管道都可以在当前模块中的任何组件模板中使用。
Angular只会创建和管理在 declarations 中声明的组件、指令和管道。
示例：

import { NgModule } from '@angular/core';
import { MyComponent } from './my-component';
import { MyDirective } from './my-directive';
import { MyPipe } from './my-pipe';

@NgModule({
  declarations: [MyComponent, MyDirective, MyPipe],
  // ...
})
export class MyModule { }

imports（导入）：

imports 数组中列出了当前模块所依赖的其他模块。
通过 imports，你可以在当前模块中使用其他模块中声明的组件、指令和服务。
Angular模块之间的依赖关系是通过 imports 来建立的。
示例：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common'; // 导入CommonModule

@NgModule({
  imports: [CommonModule], // 导入CommonModule
  // ...
})
export class MyModule { }

providers（提供者）：

providers 数组中列出了当前模块提供的服务。
服务是用来共享数据或功能的，providers 声明了哪些服务在当前模块中是可用的。
当在 providers 中列出的服务被注入到组件或其他服务中时，它们会被创建或共享。
示例：

import { NgModule } from '@angular/core';
import { MyService } from './my-service';

@NgModule({
  providers: [MyService], // 提供MyService服务
  // ...
})
export class MyModule { }

exports（导出）：

exports 数组中列出了当前模块中声明的组件、指令和管道，这些组件、指令和管道可以被其他模块导入并使用。
通常，exports 用于共享模块中的一些可重用的组件、指令或管道，使它们在其他模块中可用。
示例：

import { NgModule } from '@angular/core';
import { MyComponent } from './my-component';

@NgModule({
  declarations: [MyComponent],
  exports: [MyComponent], // 导出MyComponent组件
  // ...
})
export class MyModule { }