使用 Angular 5 显示和隐藏答案

【问题标题】：show and hide using angular 5使用 Angular 5 显示和隐藏
【发布时间】：2018-06-02 23:39:44
【问题描述】：

<div class="m-t-sm">
<app-button [btnText]="'ADD USER'" (click)="!show"  [btnType]="'text'" [btnColor]='"submit-btn-color"'></app-button>
</div>

只有当点击“添加用户”按钮时，才会出现下面的 div。这段代码有效，但我需要知道有没有更好的方法来做到这一点。

 <div class="selected-code-box" *ngIf="show">
          <div class="row no-margins">
            <div class="col-md-4"></div> ...//code goes.. 
</div>

【问题讨论】：

你可以在按钮点击时使用类似 show = !show 的东西吗？
是的，您可以像 (click)="show =!show" 一样使用它

标签： typescript angular5

【解决方案1】：

我不确定您在寻找什么，但 *ngIf 是解决此问题的最佳方法

<app-button [btnText]="'ADD USER'" (click)="show = !show"></app-button>

<div *ngIf="show">
      <!-- code -->
</div>

【讨论】：