Javascript 如何不渲染ViewChild元素，而是在父组件中访问它？

我在另一个组件中使用了一个组件，如下所示：

<inline-help>
            <help-title>{{::'lang.whatIsThis'|i18n}}</help-title>
            <help-body i18n="lang.helpBody"></help-body>
</inline-help>

我想做的是创建一个新组件，如

，我可以在内部使用它：

@Component({
    selector: 'inline-help',
    template: `
<div class="inline-help">
    <div class="help-icon">
        <i class="en-icon-help"></i>
    </div>
    <inline-help-content [helpTitle]="something" [helpBody]="something"></inline-help-content>
</div>`
})

@组件({
选择器：“内联帮助”，
模板：`
`
})

但是我不想改变所有的

<inline-help>
            <help-title>{{::'lang.whatIsThis'|i18n}}</help-title>
            <help-body i18n="lang.helpBody"></help-body>
</inline-help>

{{：：'lang.whatissis'| i18n}

---

我在代码库的其他部分中使用的，因为这太多了。是否可以解析ViewChild，然后获取其中的文本，并调用另一个组件以将文本作为输入？

在

InlineHelpComponent

模板中，您可以将

封装在元素中，并为其分配模板引用变量：

这些模板引用变量允许您访问本机元素，因此您可以将这些元素的

innerText

属性传递到新的

InlineHelpContentComponent

（只需确保在

InlineHelpComponent

中隐藏投影内容，这样它就不会显示两次）。以下是

InlineHelpComponent

模板的外观：

演示这种方法

我发现我必须将

*ngIf=“showInlineHelpContent”

包含在

内联帮助内容

组件中，并在

setTimeout

后在

ngAfterContentInit

中设置标志，否则我会得到一个

表达式更改TerithasBeenCheckedError

错误

<inline-help>
            <help-title>{{::'lang.whatIsThis'|i18n}}</help-title>
            <help-body i18n="lang.helpBody"></help-body>
</inline-help>