如何在单击事件Angular5上显示组件选择器答案

【问题标题】：How to show component selector on click event Angular5如何在单击事件Angular5上显示组件选择器
【发布时间】：2019-02-04 23:59:24
【问题描述】：

我在点击事件时显示另一个组件时遇到问题，这是我的代码：

<div (click)="showThis = true"></div>
<div class="" [ngClass]="{'hide': showThis}"></div>
<div class="" [ngClass]="{'show': showThis}">
  <another-screen></another-screen>
    </div>

它同时显示，首先应该显示没有任何点击，如果点击事件然后这个隐藏，另一个组件将显示

表示将应用隐藏和显示类任何帮助谢谢

【问题讨论】：

标签： angular5 angular-components ng-class

【解决方案1】：

为什么不使用隐藏：

<div (click)="showThis = true"></div>
<div class="" [hidden]="!showThis"></div>
<div class="" [hidden]="showThis">
    <another-screen></another-screen>
</div>

*ngIf 从 DOM 中删除 html 元素，但 [hidden] 用于显示不显示或阻止 html 元素，与隐藏和显示相同

【讨论】：

@RiteshDoomra 如果对您有帮助，请不要忘记接受答案

【解决方案2】：

为什么不使用*ngIf

<div (click)="showThis = true"></div>
<div *ngIf="!showThis "></div>
<div *ngIf="showThis ">
  <another-screen></another-screen>
</div>

【讨论】：