根据按钮点击显示 div

Question

我正在尝试根据是否单击按钮来显示 div，但这似乎不起作用。

组件HTML

<button ng-click="showFormToggle()">Click</button>

<div ng-show="showForm">

</div>

我也试过了

<button (click)="showFormToggle()">Click</button>

<div *ngIf="showForm">

</div>

组件打字稿

 showForm: boolean = false;

 showFormToggle(){
    this.showForm = true;
    console.log(this.showForm);
  }

Answer 1

在你的 html 中：

<button (click)="showFormToggle()">Click</button>

            <div *ngIf="isChecked">
                Clicked!
            </div>

在你的 ts 文件中，在构造函数之前：

isChecked = false;

你的函数：

showFormToggle(){
    this.isChecked = !this.isChecked;
}

希望这就是您要找的！

Answer 2

根据您的组件 HTML，您可能会混淆您正在使用的 Angular 版本。我假设您打算使用 Angular2+，考虑到您的命名约定（组件与控制器），因此第一个示例不再有效（即 AngularJS）。 component.ts

showForm : boolean = false;

component.html

<button (click)="showForm = !showForm">Click</button>
<div *ngIf="showForm">
</div>

或

<button (click)="showForm = !showForm">Click</button>
<div [hidden]="!showForm">
</div>

请确认您使用的是什么，Angular 2+ 或 AngularJS。

Showing a div based on button click