我制作了一个自定义选择元素，但出现了一个奇怪的错误。
这里我已经重现了这个错误：https://stackblitz.com/edit/angular-ff7i5j
new-address 组件是产生此错误的组件。我只能从选择组件中选择一个项目，之后似乎不再调用来自select.ts 的函数OptionSelectedEvent。
我真的不知道为什么第一个示例运行良好，而在 new-address 组件中却不起作用。
我希望有人能帮我解决这个奇怪的问题。
【问题讨论】：
这里发生的情况是，在 Angular 模板中使用 getter 会导致许多我们没有预料到的问题。
我说的是你代码中的这些吸气剂：
public get Judete(): any[] {
return [{auto: "AB", nume: "Alba"}, {auto: "AR", nume: "Arad"}...];
}
Angular 检查模板绑定并在每个更改检测周期执行所有 getter。该模板获取 Judete 数组的新实例，每次检查时每个项目都有新实例。
现在让我们看看你在哪里使用该数组。
*ngFor="let item of Judete"
Angular 内置的ngForOf 指令使用特殊算法在IterableDiffers 的帮助下查找数组中的更改。这不同会发现您的数组在每个更改检测周期中都是一个全新的数组，这会导致重新渲染项目。这意味着在每次更改检测运行时都会创建新的 SelectOptionComponent 项，并且您会失去对 ContentChildren 的订阅
所以解决方案应该很简单：只需定义一次数组，而不是使用 getter：
Judete = [{auto: "AB", nume: "Alba"}, {auto: "AR", nume: "Arad"}, ...];
【讨论】：