Question

我想简单地隐藏按钮单击时显示为隐藏的元素。我试图在Angular中使用[hidden]属性。

<div class="table-responsive" [hidden]="isHidden">
<table class="table">
<thead class="thead-light">
  <tr>
    <th style="text-align:center">{{blueFighter}}</th>
    <th style="text-align:center">Round</th>
    <th style="text-align:center">{{redFighter}}</th>
  </tr>
</thead>
<tbody class="tablerows">
..Div continues down here

</div>
<button (click)="createCardClick(hide)" class="btn btn-success">Create Scorecard</button>

打字稿：

createCardClick(hide) {
hide.hidden = !hide.hidden;

}

到目前为止，实际上什么都没发生，还不确定不确定隐藏的装扮如何工作。

Answer 1

我自己弄清楚了。我改用* ngIf。

TS：

 showHide: boolean;

 createCardClick() {
this.showHide = !this.showHide;
this.rounds = Array(this.selectedRounds).fill(0).map((x, i) => i);
}

HTML

<div class="table-responsive" *ngIf="showHide">

  <button (click)="createCardClick()" class="btn btn-success">Create Scorecard</button>

单击按钮显示元素

1 个答案: