代码之家 › 专栏 › 技术社区 › sander

显示基于按钮单击的DIV

angular-ng-if typescript angular

0

sander · 技术社区 · 7 年前

我试图根据按钮是否被点击来显示一个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);
  }

2 回复 | 直到 7 年前

1

Geoff Lentsch 7 年前

基于组件HTML,您可能会被混淆为所使用的角度版本。我假设您打算使用Angular2+,考虑到您的命名约定(组件与控制器),因此第一个示例不再有效(即AngularJS)。组件.ts

showForm : boolean = false;

组件.html

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

或

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

请确认您使用的是Angular2+或AngularJS。

2

0

Shahriyar Mammadli 7 年前

在HTML中:

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

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

在TS文件中,在构造函数之前:

isChecked = false;

您的功能:

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

我希望这就是你要找的!