如果 Angular 9 中不存在子组件，如何在父元素上设置 display:none ?

Question

我想将我的一些推特帖子嵌入到网站中。我将Twitter提供的嵌入HTML放入网站，然后调用window.twttr.widgets.load()，为嵌入HTML添加样式和推文。用户看到了这种从普通风格到Twitter风格的转变。我想使用display: none在后台执行此转换，然后显示已经样式化的推文帖子。当twitter-widget元素存在时，将呈现该帖子。

假设我有：

<div *ngFor="let post of posts">
<div
#twitterPost
class="post"
[style.display]="hasChild() ? 'block' : 'none'"
>
<div [innerHTML]="post.EmbedHTML"></div>
</div>

hasChild()应该检测twitter-widget元素何时存在于.post中。我该怎么做？

Answer 1

尝试这样做。

<div *ngFor="let post of posts" [style.display]="hasChild() ? 'block' : 'none'">
<div
#twitterPost
class="post">
<div [innerHTML]="post.EmbedHTML"></div>
</div>