在Angular4中,providers中的multi:true是什么意思?

12

我在angular4中使用HTTP_INTERCEPTORS。为此,我创建了一个实现HttpInterceptor接口并提供intercept方法定义的HttpServiceInterceptor类。然后像这样注册了HTTP_INTERCEPTORS的提供者:

providers: [{
    provide: HTTP_INTERCEPTORS,
    useClass: HttpServiceInterceptor,
    multi: true
}],

这个目前运行得很好。但是我不明白这里的multi:true是什么意思?我已经阅读了这个答案

如果我移除multi:true选项,那么浏览器会报错。

Uncaught Error: Provider parse errors:
Mixing multi and non multi provider is not possible for token InjectionToken_HTTP_INTERCEPTORS ("[ERROR ->]"): in NgModule AppModule in ./AppModule@-1:-1
    at NgModuleProviderAnalyzer.webpackJsonp.487.NgModuleProviderAnalyzer.parse (vendor.js:36335)
    at NgModuleCompiler.webpackJsonp.487.NgModuleCompiler.compile (vendor.js:43184)
    at JitCompiler.webpackJsonp.487.JitCompiler._compileModule (vendor.js:51527)
    at vendor.js:51472
    at Object.then (vendor.js:26354)
    at JitCompiler.webpackJsonp.487.JitCompiler._compileModuleAndComponents (vendor.js:51470)
    at JitCompiler.webpackJsonp.487.JitCompiler.compileModuleAsync (vendor.js:51399)
    at PlatformRef_.webpackJsonp.0.PlatformRef_._bootstrapModuleWithZone (vendor.js:4746)
    at PlatformRef_.webpackJsonp.0.PlatformRef_.bootstrapModule (vendor.js:4732)
    at Object.<anonymous> (app.js:23366)

这意味着HTTP_INTERCEPTORS是一个多提供者,用于初始化多个指令或组件吗?如果是这样,那么其他指令和组件是什么?

这是否意味着HTTP_INTERCEPTORS是一个多提供者,用于初始化多个指令或组件?那么其他的指令和组件是什么?


多提供者与指令或组件无关。所引用的答案只是举例说明指令而已。 - Estus Flask
那么根据答案,HTTP_INTERCEPTOR是一个提供多个指令的令牌,注册新的提供程序将覆盖其他已注册的提供程序? - Sunil Garg
它为每个标记提供多个值。再次强调,这与指令无关。 - Estus Flask
1
拦截器不是指令或组件。提供者提供服务的实例。当使用multi时,提供者允许将服务添加到注册给定令牌的服务数组(这里是拦截器)。因此,HttpClient将获取一系列拦截器,这些拦截器将按链式调用。 - JB Nizet
1个回答

12

多个提供程序与指令没有任何关系。 这个答案 仅将指令作为示例提到。

考虑到FOO是注入令牌,此

providers: [
  { provide: FOO, useClass: Bar, multi: true },
  { provide: FOO, useClass: Baz, multi: true }
]

FOO 注入的依赖项变为一个由多个提供程序组成的数组,这些提供程序都被分配给该令牌,即相当于:

providers: [
  { provide: FOO, useValue: [Bar, Baz] }
]

区别在于多个提供者可以在同一个注入器上的多个地方进行定义,所有额额外的{ provide: FOO, multi: true, ... }都会向FOO数组执行push操作。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接