Angular独立模式下如何在服务中使用CommonModule管道（无需全局导入）

因为DecimalPipe是CommonModule提供的可注入类，我们可以通过单独提供该类的方式，替代导入整个CommonModule，具体有以下几种实现方式：

方式一：在ExportService内部提供DecimalPipe #

直接在服务的@Injectable装饰器的providers数组中添加DecimalPipe，让服务自己管理所需依赖的提供者：

@Injectable({
  providedIn: 'root',
  providers: [DecimalPipe] // 局部提供DecimalPipe
})
export class ExportService {
  constructor(private decimalPipe: DecimalPipe) {}
  // ... 你的业务逻辑
}

方式二：在AppModule的providers中单独注册DecimalPipe #

如果希望DecimalPipe能被全局复用，可以在app.module.ts的providers数组中单独添加它，无需导入CommonModule：

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    IconsModule,
    MatDialogModule,
    MatSnackBarModule,
    HttpClientModule,
  ],
  providers: [DecimalPipe], // 全局注册DecimalPipe
  bootstrap: [AppComponent]
})
export class AppModule {}

方式三：独立组件启动时提供DecimalPipe（如果应用用独立模式启动） #

如果你的应用是通过bootstrapApplication启动独立组件，可以在启动配置的providers中添加DecimalPipe：

// main.ts
import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app/app.component';
import { DecimalPipe } from '@angular/common';

bootstrapApplication(AppComponent, {
  providers: [
    // 其他全局提供者
    DecimalPipe
  ]
});

注意事项 #

DecimalPipe依赖LOCALE_ID令牌，默认情况下BrowserModule会提供默认的LOCALE_ID（值为'en-US'），如果你的应用没有导入BrowserModule，需要手动提供LOCALE_ID，比如：

providers: [
  DecimalPipe,
  { provide: LOCALE_ID, useValue: 'zh-CN' } // 自定义语言环境
]

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