问题标签 [ng-content]

我在容器组件中有以下结构（ngrx 方法）container-page.component.ts

<parent-comp><child-comp [someInput]="someValue"></child-comp></parent-comp>

我在我的parent-comp模板中

现在将数据从容器传递到child-comp工作正常，但是如果我想直接将一些数据从容器传递parent-comp到child-comp呢？

做<ng-content [inputFromParent]="valueFromParent"></ng-content>是行不通的。

我有包含多个ng-content元素的组件模板：

我如何检查是否提供了内部*ngIf条件#footer？

我尝试过这样的事情，但这不起作用：

我有一些使用resolveComponentFactory.

我这样做是这样的......

但是我有一个我正在努力解决的问题......

这按预期工作

这不能按预期工作：

似乎ng-contentselect 属性不适用于动态编译的内容。

有什么想法我做错了什么还是这是一个错误？

如果有帮助，我正在使用 Angular 8。

更新：我在这里的 stackBlitz 中重现了这个问题：https ://stackblitz.com/edit/angular-ivy-givxx6

我正在使用引导程序和角度，并制作一个包含菜单的组件。

如果屏幕大，我希望他在导航栏中，但如果屏幕小，我希望它在下拉菜单中。

我目前有这个：

问题是，ng-content 只出现一次，而且它在下拉列表中。有没有办法让它在两种情况下都出现，或者切换它？

当默认视图显示为无/块时，我正在考虑切换布尔值

编辑：我试过这个，但它也不起作用。

我有以下场景......

和...

然后...

一个子组件，我们称之为child-component，嵌入在parent-component中。我在父组件上使用 ng-for来使用嵌入的子组件列出数据数组...我需要能够在任何嵌入的子组件上执行(click)="HideThis()"。 .. 我的尝试（如上）隐藏了内容，但是当我单击 HideThis() 时，在父组件的 DOM 中留下了一个空白的子组件元素。我希望完全删除或避免列出相应的子组件。

我不能使用 listData[n].item.prop 之类的属性来进行 *ngIf 测试。listData 来自远程服务器。有没有办法避免使用类似的东西@Output() onHidden: EventEmitter<any> = new EventEmitter<any>();

我尝试过ng-template和ng-content无济于事。最好的方法是什么？

我如何通过更新内容元素上的选择器来更新 ng-content？

我在 app.component.html 中有代码：

这是 my-slider.component.ts 的代码：

和 ImgComponent.ts

当我单击按钮时，会向元素添加一个类，但 ng-content 永远不会更新。我能以某种方式使它工作吗？或者我如何过滤 ng-content 中的组件？

我正在处理实现自定义表并遇到问题。

我无法在表格组件中正确投影列组件内容。

• table.component.ts：

• column.component.ts：

我已经添加了在哪种情况下使用哪个模板的注释。

在这个 StackBlitz 示例中，您可以看到它是如何工作的。该按钮仅在最后一列的最后一个单元格中呈现，但我希望最后一列中的所有单元格都将呈现按钮。

我的问题是如何正确呈现列内容？

所以目前我有一个组件，它有多个按钮可以配置选项：

test.component.html

测试组件.ts

父组件.html

想法是这个组件更大并且可以重用，只有按钮和操作会改变，但它总是需要表单。

是否有其他更好的解决方案来获取此类组件，使用 ng-content 并以某种方式在父组件中触发表单？

我正在尝试创建一个组件，该组件会将 mat-option's 传递给 mat-autocomplete，但不会出现传入的选项。

我的组件：

父组件：

请注意，如果我取消注释组件中的预设选项，所有选项都会显示。我需要用 ng-content 实现 mat-autocomplete 更新吗

组件是否可以接收在开始标签和结束标签之间传递给它的内容并将输入直接分配给innerHTML接收模板内部？

我有这样的string输入：

并将它放在我的组件中，如下所示：

在里面app-content我可以ng-content在模板中使用来投影输入内容。由于输入是 astring我只能看到 a string，因此它描述的 HTML 元素不会呈现。

我试图通过 注入ElementRef并访问文本节点this.elementRef.nativeElement.textContent，但必须先渲染内容才能以这种方式访问​​它。

当然，我可以ng-content像这样隐藏内容生成：

然后得到textContent一个变量（例如content）并像这样设置它：

但这对我来说似乎很老套。

StackBlitz 项目：get-input-of-ng-content-directly

我错过了什么吗？

我想在模板中做这样的事情：<div [outerHTML]="incoming ng-content stuff"></div>

或者至少在组件构造函数中注入内容并将其设置为变量，但不首先渲染内容只是为了隐藏它。