网站搜索

typescript - 使用 Angular 5 显示和隐藏


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

答案#1

我不确定你在寻找什么,但 *ngIf 是解决这个问题的最佳方式

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

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