Angular 在不同@angualr/cli版本（9.0.2和8.3.14）的层次结构注入器中，指示控件具有不同的行为

我正在学习角度博士课程

文档使用

示例指示提供程序和视图提供程序之间的差异

链接是

但是我对在

然后我在结果中找不到一些规则。我在AngularV9中用相同的代码做了更多的实验。（CLI版本为v9.0.2。）

当代码都相同时，结果就不同了

对于v9，结果似乎是指令的
提供者
充当
提供者
和
app child的
视图提供者
之间的拦截器

但对于v8.3.14…v7.0.0（CLI版本），我发现情况有所不同

为什么?？（对不起，我的英语很差……
关于你的第一个问题：

{{flower.emoji}{{animal.emoji}}

您正在将
flower.emoji
和
animal.emoji
代码添加到
app.component.html
文件中，因此angular使用
app.component.ts
中提供的服务。由于
app.component.ts
不提供任何服务，且其父母
app.module.ts
也不提供任何服务，他们使用root:whale and flower中提供的服务

换句话说：如果你在
app.component.ts
文件中显示一个变量，他显示的是提供给他的东西（鲸鱼和花），他不知道提供给
app child的是什么，也不应该知道（否则你在组件之间创建了耦合，这是不好的）

对于你的第二个问题，我不知道该告诉你什么，把你的指令交给stackblitz，我可以试着解释那里发生了什么

祝你学习顺利
 关于你的第一个问题：

{{flower.emoji}{{animal.emoji}}

您正在将
flower.emoji
和
animal.emoji
代码添加到
app.component.html
文件中，因此angular使用
app.component.ts
中提供的服务。由于
app.component.ts
不提供任何服务，且其父母
app.module.ts
也不提供任何服务，他们使用root:whale and flower中提供的服务

换句话说：如果你在
app.component.ts
文件中显示一个变量，他显示的是提供给他的东西（鲸鱼和花），他不知道提供给
app child的是什么，也不应该知道（否则你在组件之间创建了耦合，这是不好的）

对于你的第二个问题，我不知道该告诉你什么，把你的指令交给stackblitz，我可以试着解释那里发生了什么

祝你学习顺利
 你检查过“@Input”指令了吗？您可以使用@input指令将数据注入子组件。不，很抱歉我只是做了一些实验，我知道我可以使用
@input
将数据注入子组件。您检查了“@input”指令吗？您可以使用@input指令将数据注入子组件。不，很抱歉我刚刚做了一些实验，我知道我可以使用
@input
将数据注入子组件。谢谢！我第一个问题就明白了。这里是forked stackbliz链接：是的，它看起来像是该指令覆盖了其主机组件的提供程序，这很有趣，但我可以想象，在一个真实的示例中混合所有这些（主机+子级+指令提供程序/视图提供程序）可能会导致复杂的行为。友好提示，您的代码应该易于同事理解；）但是，如果所有东西都被恰当地命名，那么在同一子组件的不同实例中提供不同服务似乎是一个很好的工具。谢谢！我第一个问题就明白了。这里是forked stackbliz链接：是的，它看起来像是该指令覆盖了其主机组件的提供程序，这很有趣，但我可以想象，在一个真实的示例中混合所有这些（主机+子级+指令提供程序/视图提供程序）可能会导致复杂的行为。友好提示，您的代码应该易于同事理解；）但是，如果一切都被恰当地命名，那么它看起来是一个很好的工具，可以在同一子组件的不同实例中提供不同的服务
<app-child>{{flower.emoji}}{{animal.emoji}}<app-inspector></app-inspector></app-child>

<app-child appInterceptor>...</app-child>