Angular Dependency Injection (DI) 示例

Angular 的依赖注入（DI）是框架的核心特性之一，它允许开发者将组件的依赖关系通过类型而非实例进行管理。以下是一些Angular DI的示例。

示例1：简单服务注入

在Angular组件中注入一个服务，例如一个计数器服务。

import { Component } from '@angular/core';
import { CounterService } from './counter.service';

@Component({
  selector: 'app-root',
  template: `
    <p>Count: {{ count }}</p>
    <button (click)="increment()">Increment</button>
  `
})
export class AppComponent {
  count = 0;

  constructor(private counterService: CounterService) {}

  increment() {
    this.count = this.counterService.increment();
  }
}

示例2：提供器注入

使用提供器（Provider）在模块级别注册服务。

import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { CounterService } from './counter.service';

@NgModule({
  declarations: [AppComponent],
  imports: [],
  providers: [CounterService],
  bootstrap: [AppComponent]
})
export class AppModule {}

图片示例

Angular Dependency Injection

更多关于Angular的依赖注入，您可以阅读我们的Angular DI 指南。