如果在Angular 9中没有子组件，如何在父元素上设置display:none？

Question

我想把我在twitter上的一些帖子嵌入到这个网站上。我将Twitter提供的embed HTML放入站点，然后调用window.twttr.widgets.load()，它将样式和tweet添加到embed HTML中。用户可以看到这种从普通到Twitter风格的转变。我想使用display: none在后台执行此转换，然后显示已设置样式的Tweet post。当存在twitter-widget元素时，将呈现post。

假设我有：

 <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>