Angular对话框:如何根据状态使按钮打开或关闭
创始人
2024-10-24 15:31:38
0

为了根据状态在Angular对话框中使按钮打开或关闭,我们需要使用DialogRef并在template中添加ngIf指令。以下是步骤:

1.在dialog component中,注入DialogRef。

import { Component, OnInit, Inject } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from "@angular/material/dialog";

@Component({
  selector: 'app-dialog-example',
  templateUrl: './dialog-example.component.html',
  styleUrls: ['./dialog-example.component.css']
})
export class DialogExampleComponent implements OnInit {
  //injecting DialogRef
  constructor(public dialogRef: MatDialogRef) { }

  ngOnInit() {
  }

}

2.在template中,使用DialogRef访问传递给Dialog的数据,并设置标志以在根据状态打开或关闭按钮。在这里,我使用data中的isOpen标志。

Dialog Example

Dialog Content

是的,这是我们需要的。现在,让我们来看看如何在打开Dialog之前设置isOpen标志。

3.在打开Dialog时,添加一个字典,并将isOpen标志设置为true。在这里,我使用openDialog()方法。

import { Component } from '@angular/core';
import { MatDialog } from "@angular/material/dialog";
import { DialogExampleComponent } from "./dialog-example/dialog-example.component";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  isOpen:boolean = false;
  constructor(public dialog: MatDialog){}

  openDialog(){
    let dialogRef = this.dialog.open(DialogExampleComponent,{
      data : {isOpen : true}
    });
  }
}

现在当我们调用openDialog()方法时,我们会得到一个具有isOpen标志的Dialog。

希望这能帮助您在Angular对话框中根据状态使按钮打开或关闭。

相关内容

热门资讯

揭秘关于!wpk插件,we p... 揭秘关于!wpk插件,we poker插件,扑克教程(有挂透明)是一款可以让一直输的玩家,快速成为一...
必看攻略!大菠萝免费辅助器,a... 必看攻略!大菠萝免费辅助器,aapoker透视脚本下载,2025新版技巧(有挂软件);玩家必备必赢加...
科技揭秘!wepoker透视破... 1、科技揭秘!wepoker透视破解版,wepoker有没有挂,普及教程(有挂软件)。2、wepok...
实测必看!hhpoker底牌透... 实测必看!hhpoker底牌透视脚本,wepoker怎么开辅助,wpk教程(有挂透明);1.hhpo...
科普常识!wejoker辅助器... 科普常识!wejoker辅助器要钱玩吗,红龙poker辅助平台,可靠教程(有挂技巧)准备好在wejo...
技术分享!约局吧德州真的有透视... 1、技术分享!约局吧德州真的有透视挂吗,aapoker怎么设置抽水,必赢方法(有挂辅助);详细教程。...
实操分享!aa poker辅助... 此外,数据分析德州(来玩app破解)辅助神器app还具备辅助透视行为开挂功能,通过对客户来玩app破...
一分钟秒懂!wepoker俱乐... 一分钟秒懂!wepoker俱乐部辅助器,德扑圈有透视吗,我来教教你(有挂软件)1、点击下载安装,微扑...
科普常识!hhpoker可以开... 科普常识!hhpoker可以开挂吗,wepoker透视苹果系统,专业教程(有挂透视);玩家必备必赢加...
玩家必看分享!wepoker脚... 玩家必看分享!wepoker脚本,哈糖大菠萝辅助器,2025版教程(有挂教程);原来确实真的有挂(需...