总结我想要完成的事情

• 将组件动态添加到ViewContainerRef（完成）
• 用属性初始化这些动态组件（完成）
• 访问动态创建的 Component 实例，以便我可以根据实际情况做出决定。

问题

• 动态添加组件时，它们被添加到ViewContainerRef
• ViewContainerRef提供方法，例如get(index)return ViewRef。
• ViewRef似乎与Component实例没有任何关系，这使得获取所需数据成为一项挑战

这是一个 Stackblitz 链接，其工作代码如下所示（用于动态创建组件）

首先使用appComponent创建一些组件ComponentFactoryResolver，然后将它们添加到ViewChild模板中定义的内容中。每个都使用我们在创建后尝试引用DynamicComponent的属性值进行初始化id

添加的DynamicComponent内容相当简单。为简化起见，它只包含id我们试图获得的单个属性

到目前为止一切都很好。

• 组件是动态创建的
• 组件实例使用 ID 进行初始化，我们可以通过它在 UI 中显示的 fat 看到

问题在于尝试从 DynamicallyCreated 组件中检索 ID 属性。

在 中AppComponent，当用户单击按钮时，该getCompRef()方法被调用并循环遍历childCont (ViewContainerRef)

但是ViewRef返回的 fromViewContainerRef.get()是一个子类，ChangeDetectoreRef并且不包含对相关实例的任何引用。

在对这个问题进行研究时，它尝试沿着使用的路径ViewChildren来获取正在创建的列表组件，但这并没有奏效，因为诸如以下问题

• https://github.com/angular/angular/issues/8785
• 或示例假定在模板中使用的指令用于ViewChildren selector已在模板中预定义的组件
• 我看到很多关于一些人希望在拥有 ViewRef 时获得 ViewRef 的问题Component.instance，但这在这种情况下没有帮助。

最后我的问题是，

• 有没有一种简单的方法可以从ViewRef我缺少的 Component 实例中获取

任何帮助表示赞赏。

谢谢你。

我正在使用 Angular 10，并尝试使用 QueryList，代码如下（就像网络上的许多示例一样）

HTML

TS

在组件中运行 console.log(this.someIds) 时，在组件初始化之后，我实际上得到了一个 ElementRef 对象（可能是第一个或最后一个 div）而不是整个列表。

我究竟做错了什么？

我使用了@ViewChildren 组件：

}

但是当尝试调用异步变量数据时，返回undefind

我能做些什么来解决这个问题？

我有一个案例，我有一个父组件和 2 个子组件（基于 ng-select 的选择组件）这个想法是，当我在第一个 ng-select 中选择和项目时，应该在第二个中禁用相同的。反之亦然。

在父我使用@ViewChildren 来查询组件和设置禁用输入属性

在孩子们中，当我在 ng-select 中选择和项目时，我会在父母中发出我需要的信息

在这种方法中，我然后找到正确的子组件并设置禁用的输入属性

在子组件中，我有 ngOnChanges 方法来检查更改，但 disabledConnection 属性没有得到更新

它仅在我进行页面加载时有效

父视图：

孩子：

我在这里想念什么？

-贾尼

我正在使用以下 Angular 标记创建多个 ModuleItemComponents：

以下代码位于相应的 .ts 文件中：

我在 ngAfterViewInit 事件中使用代码来尝试获取对每个 ModuleItemComponent 的引用：

但是，我在“.subscribe”行出现错误，因为 thisModule 的类型是 app-module-item，而不是 ModuleItemComponent。

我确定我做错了什么 - 只是不知道如何正确地做到这一点。任何帮助表示赞赏。

我正在使用装饰器@ViewChildren 将数据表单从子组件发送到父组件。

这是我的父组件.ts：

在我的父 component.html 中：

这是我的孩子 component.ts ：

这是我的孩子 component.html ：

我收到错误消息cannot read property value of undefined。但是当我写console.log(this.generalDataComponent)它时，它在控制台中给了我：

阅读 QueryList，我可以看到它是一个不可修改的列表，但它包含一个名为更改的可观察对象，我可以订阅并访问它收到的任何更改。它还有一个 reset() 函数，可以“更新查询列表的存储值”。

在我的例子中，QueryList 是 @ViewChildren 指令的结果，该指令查询页面上的一组视图。我对其工作原理的猜测是，当 Angular 将所有内容绘制到屏幕上时，QueryList 会触发，并且我们会得到一些相关视图的列表。如果我然后运行：

然后我可以访问这些视图。但是现在让我们考虑一个新视图（我们称之为 newView）被添加到屏幕上。如果我此时访问 queryList，它不应该改变。但是如果我订阅了 queryList.changes，那么我会收到一个包含所有旧视图和新视图的新视图列表。

如果我想让 myQueryList.toArray() 反映这些更改，我必须执行以下操作：

1. myQueryList.changes 的结果是否包含屏幕上与 ViewChildren 查询相关的所有视图，还是仅包含最初不存在的新视图？
2. 在上述庄园中使用重置是更新 myQueryList 内容的正确方法吗？

我可以使用它们的 ID 突出显示静态菜单项（左侧），但无法突出显示我的菜单列表中动态生成的部分（因素列表）。我正在使用 ViewChild 来获取静态菜单项，并使用 ViewChildren 来获取所有与因素相关的菜单名称。

单击并滚动到锚标记也可以工作，只是坚持这一点。

我无法获得它的偏移值

.html

.ts

有什么建议么？

（角度 CLI：1.7.4）

我在组件中使用 ViewChildren。如果我将其定义为，它工作正常

但是，当我将 testComponents 的类型指定为 QueryList 时：

它给出了错误：

ERROR in ./src/app/components/search-component/search.component.ts Module not found: Error: Can't resolve '@angular/core/src/render3' in 'D:\Test Applications\test-application\src\app\components\search-component'

我已经解决了很多与这个 Angular 特性相关的 SO 问题，但没有一个解决方案似乎对我的方案有帮助。我正在使用Angular Material 树组件，并尝试在完全展开的节点中生成一个组件。

我的Tree.component.html：

我的ViewChildren装饰器声明Tree.component.ts：

我的Dynamic.component.ts：

每次我尝试访问children时，都QueryList没有结果。

我尝试过的其他事情：

• 使用“读取”元数据属性：

  *.ts：

  *.html：

• 通过以下方式订阅QueryList更改AfterViewInit()：

• 使用ContentChildren（有和没有'read'参数）：

  *.ts：

  *.html：

• 通过指令访问组件：

• 强制变更检测后访问：

我在这里做错了什么？