如何从Angular所有层级获取多提供者（Multi Providers）实例？

好问题！答案是完全可以——这正是Angular多提供者（multi providers）设计的核心场景之一，完美匹配你描述的组件层级和配置。

按照你的场景：

• <comp-a>注册了{provide: X, useValue: "A", multi: true}
• <comp-b>注册了{provide: X, useValue: "B", multi: true}
• <comp-c>是最内层的子组件

当你在comp-c中通过依赖注入获取X时，Angular会自动遍历当前组件的所有祖先注入器（从最外层的comp-a到直接父组件comp-b），收集所有注册为multi: true的X提供者值，最终返回一个按祖先顺序排列的数组。

具体实现示例 #

在comp-c中注入X的代码如下：

import { Component, Inject, InjectionToken } from '@angular/core';

// 定义你的注入令牌
export const X = new InjectionToken<string>('X');

@Component({
  selector: 'comp-c',
  template: `<p>Collected values: {{ values.join(', ') }}</p>`
})
export class CompCComponent {
  constructor(@Inject(X) public values: string[]) {
    console.log(this.values); // 控制台会输出 ["A", "B"]
  }
}

几个关键细节要注意： #

• 顺序规则：数组的顺序是从最外层祖先到最内层父组件，所以"A"会排在"B"前面。如果comp-c自己也注册了同一个multi提供者，它的值会被追加到数组末尾。
• 必须统一设置multi: true：如果任何一个祖先组件的提供者没有设置multi: true，它会直接覆盖之前所有的multi提供者值，而不是追加——这会破坏你想要的收集效果，一定要确保所有相关提供者都开启了multi模式。
• 注入器层级：Angular的注入器是层级化的，multi提供者会自动向上遍历所有祖先注入器（模块注入器→组件注入器链），所以只要是在当前组件的注入器链上的multi提供者，都会被收集到。

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