NgModule中的声明、提供程序和导入之间的区别

在Angular应用程序中，我们使用NgModule来组织代码，这包括声明组件、指令和管道、提供应用程序所需的依赖项以及引入其他模块。NgModule中包含三个重要的元素：声明、提供程序和导入。下面将详细介绍这三个元素的区别和使用方法。

声明

在NgModule中，我们可以使用declarations属性来声明一组组件、指令和管道。这些组件、指令和管道只能在当前模块中使用，无法在其他模块中使用。例如：

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

import { MyComponent } from './my.component';
import { MyDirective } from './my.directive';
import { MyPipe } from './my.pipe';

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

在上面的代码中，我们声明了三个元素：MyComponent、MyDirective和MyPipe。这三个元素只能在当前模块中使用，而不能在其他模块中使用。

提供程序

在NgModule中，我们可以使用providers属性来提供应用程序所需的依赖项。这些依赖项可以是服务、工厂或值。提供程序可以是在当前模块中声明的，也可以是在导入的模块中声明的。

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

import { MyService } from './my.service';

@NgModule({
  imports: [
    CommonModule
  ],
  providers: [
    MyService
  ]
})
export class MyModule { }

在上面的代码中，我们提供了一个服务MyService，该服务可以在当前模块中使用。在实际情况中，我们可以将服务提供给整个应用程序，以供多个模块共用。

我们还可以在导入的模块中提供依赖项，如下所示：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SharedModule } from '../shared/shared.module';

import { MyComponent } from './my.component';

@NgModule({
  imports: [
    CommonModule,
    SharedModule
  ],
  declarations: [
    MyComponent
  ],
  providers: [
    MyService
  ]
})
export class MyModule { }

在上面的代码中，我们导入了一个模块SharedModule，其中提供了一个服务MyService。我们可以在当前模块中使用这个服务。

导入

在NgModule中，我们可以使用imports属性来导入其他模块。导入的模块中声明的元素可以在当前模块中使用。例如：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { MyComponent } from './my.component';

@NgModule({
  imports: [
    CommonModule,
    FormsModule
  ],
  declarations: [
    MyComponent
  ],
  providers: [
    MyService
  ]
})
export class MyModule { }

在上面的代码中，我们导入了两个模块：CommonModule和FormsModule。这些模块中声明的元素可以在当前模块中使用。

总结

在NgModule中，声明、提供程序和导入是组织代码的主要元素。声明用于声明当前模块中的组件、指令和管道；提供程序用于提供当前模块所需的依赖项；导入用于导入其他模块中的元素。理解这三个元素之间的区别是Angular应用程序开发的基础。