问题标签 [ngtemplateoutlet]

我正在研究 ngTemplateOutlet 的概念来制作动态列表系统。

这里let-item应该是items. 我应该在组件级别做什么才能得到这样的。我在stackoverflow中阅读了一些帖子，但无法明确概念（因为他们有静态templateRef - 而我不想拥有静态templateRef）。

Angular 2 模板中的 let-* 是什么？

使用 $implicit 传递多个参数

类似的代码模式正在使用 - https://www.npmjs.com/package/ng-sortable

我刚从 Angular 开始。我使用了 ng-ZORRO。

1. 我复制 ng-zorro 的例子。它运作良好。
2. 我使用 ng-template 和 ngTemplateOutlet 将其拆分为模板。它不起作用。

请参阅我关于菜单的示例。

• Menu1、Menu2 是普通代码。有用。
• Menu3，我使用 ng-template。它不起作用。

请帮我。

stackblitz 链接： https ://stackblitz.com/edit/ng-zorro-antd-ivy-5reyrg

Angular 8 Recursive Form submit for json (dynamic structure). I implemented Angular 8 recursive json(tree) display for dynamic json object but not able to get input data from Angular Form to component on submit since json structure is dynamic.

I followed Angular 8 Recursive Form but its good list obj, but I have to make it work for json object, below is my json object structure.

Any help will be appreciated. Thanks in advance. My code is here : https://stackblitz.com/edit/angular-ibi4w5?file=src%2Fapp%2Fapp.component.ts

ngTemplateOutlet在我的 Angular 代码中实现时出现以下错误

它说错误在第 707 行。我在第 707 行的代码是ngTemplateOutlet自己的代码

部分ng-template如下：

}根据遇到的错误，我没有看到丢失。我传递的道具是布尔类型（canCreateEntity，disableScroll），对象数组（entityList）和字符串（nextBookmarkList）。我无法提供一个工作示例，因为我无法在不修改它的情况下共享完整代码。谁能指出错误是什么

所以我有两个 Angular 组件，一个父级和一个子级。我想做以下事情：

1. 在引用子函数/变量的父组件中定义一个 ng-template
2. 将该模板作为参数传递给子组件，然后
3. 让子组件使用自己的实例数据显示此模板。

App.Component（父）

子组件（可重用组件）

如何为我的父模板提供来自该子组件的函数/实例变量？

这是整个项目的 Stackblitz

问题

所以我有两个 Angular 组件，一个父组件和一个子组件。父组件将自定义模板传递给子组件，然后子组件使用 ngTemplateOutlet 将模板与自己的数据结合起来。

这在大多数情况下效果很好。不幸的是，我在尝试从子级访问此父模板的 DOM 元素时遇到了问题。

如果我尝试使用<div #container></div>从默认子模板访问@ViewChild('container',{static: false})，它会毫无问题地获取元素。当我使用 app.component 传入的自定义模板执行相同操作时，我收到错误“无法读取未定义的属性‘nativeElement’”。

我还需要做什么才能访问我的模板的 DOM？

这是一个Stackblitz

App.Component（父）

child.component（儿童）

我的问题

如何使用@ViewChild 从随 DOM 中的任何更改而更新的外部模板访问此 div？（注意：删除 *ngIf 不是此项目的选项）

这是什么原因造成的？我可以使用任何生命周期方法来解决此问题吗？

我的预感 我猜在使用新模板更新 DOM 之前调用 ViewChild，我需要为 DOM 更改设置一个侦听器。我试过这个但失败了，所以我真的很感激一些关于如何最好地进行的智慧。提前致谢 ：）

<div #container></div>编辑：无论您是传入自定义模板还是使用默认模板，此解决方案都需要正确显示。

这似乎是“@angular/common”模块和常春藤编译器的问题？有任何想法吗？删除 node_modules 并更新 angular 没有任何成功。

如果我尝试 ...*ngTemplateOutlet=... 那么我在运行时收到此错误：NG0303: Can't bind to 'ngTemplateOutlet' 因为它不是 'ng-container' 的已知属性。node_modules/@angular/core/ivy_ngcc/fesm2015/core.js : 10073

角度版本 11

我有 2 个 mat-tabs，每个都有一个表，具有相同的数据布局，只是不同的数据源。

如您所见，行和列完全相同，所以我想重用表格模板，如下所示：

有了这个，我得到：

错误：缺少页眉、页脚和行的定义；无法确定应呈现哪些列。

如何定义一次模板？

我有一个组件，它有一个需要有条件地出现在父组件内的辅助模板，我想将该子组件的数据传递回其父组件。

我正在使用ngTemplateOutlet它，除了将数据传递回父级之外，我可以做所有我需要的事情，我正在使用服务来做到这一点，但我想知道是否可以让模板携带它让父母可以通过某种绑定从那里访问它吗？

页面 + 顶部栏 (1) 来自父组件，如您所见，第二个组件分为 2，顶部仅在我需要父母知道的特定条件下出现，因此它隐藏其内容并显示改为子模板

组件 2 模板：

组件 2 ts：

组件 1 模板：

组件 1 ts：

更新 当前方法的另一个问题是使这里的子组件趋向于父组件，我不希望这样，因为该子组件需要成为另一个组件的子组件。所以我需要一种方法来传递这些模板，而不会将两者捆绑在一起。

我正在尝试创建一个可以通过使用 ng-template 重复使用的表单。但不知何故，当我保存表单并调用函数时，组件中的数据不可访问doAddMenuItem(postForm)。

这是带有 的表格ngTemplateOutlet：

和 ng 模板：

以及组件中的功能：