Question

我试图通过单击按钮以打开弹出窗口来挂起事件。如何在index.ts

中创建布尔函数openPopup

.window__container {
        display: block;
        position: absolute;
        right: 102px;
        top: 100px;
        min-width: 360px;
        height: 528px;
        z-index: 10000;
    }

<button md-icon-button (click)="!openPopup"></button>
<div *ngIf="openPopup" class=.window__container>...</div>

Answer 1

将代码放在提到的文件中。

首先，在使用 class 时，您不必使用.window__container，而只需使用window__container。

点击按钮设置openPopup状态。

HTML 文件

<button md-icon-button (click)="openPopup = !openPopup">Open</button>

<!--If you want to use click function then -->

<button md-icon-button (click)="openPopup()">Open</button>
<div *ngIf="openPopup" class=window__container>
  <h1>Hello Popup</h1>
</div>

TS 文件

openPopup: boolean;

// If Want to use Function for popup
openPopup (): void {
 this.openPopup = !openPopup;
}

SCSS 文件

.window__container {
        display: block;
        position: absolute;
        right: 102px;
        top: 100px;
        min-width: 360px;
        height: 528px;
        z-index: 10000;
        background: red;

}

在CSS类中，我只放了background。

如何在点击时打开弹出窗口？

1 个答案: