Question

我在我的角度app中使用MDDialog。每当用户点击div时，

正在发生闪烁
之后，如果用户点击其中一个按钮，则不会引发afterclose事件。

有人可以建议我如何避免上述问题？

调用对话框：

    private openialog(data) {

      const dialogRef = this.dialog.open(DialogComponent, { width: 
              '350px', height: '100px', disableClose: true});
      dialogRef.updatePosition({ top: '95px' });

      dialogRef.afterClosed().subscribe(result => {

      this.dialogResult = result;

      console.log('dialogResult : ' + this.dialogResult);

      if (this.dialogResult) {
            this.Home();
        }

      });
      this.dialogResult = '';
     }

Dialog html：

 <div md-autofocus>
   <div md-dialog-container>
   <h2 md-dialog-title>Information</h2>
   <md-dialog-content> Do you want to proceed? </md-dialog-content>
   <div md-dialog-actions>
      <div class="dialogButtons">
         <button  id= "YesButton" class="dialogButton"
            (click)="dialogRef.close(true)">Yes</button>
         <span class="flex1margin"></span>
         <button   id="NoButton" class="dialogButton"  
            (click)="dialogRef.close(false)">No</button>
         </div>
       </div>
     </div>
 </div>

对话框组件：

import { Component, OnInit } from '@angular/core';
import { MdDialogRef } from "@angular/material";

@Component({
selector: 'your-dialog-selector',
templateUrl: './dialog.component.html'
})
export class DialogComponent {
     constructor(public dialogRef: MdDialogRef<any>) {
  }
}

Answer 1

当您在对话框对象上调用.close()方法时，会出现拼写错误。 dailogRef应为dialogRef

 <button  id= "YesButton" class="dialogButton"
    (click)="dailogRef.close(true)">Yes</button>
 <span class="flex1margin"></span>
 <button   id="NoButton" class="dialogButton"  
    (click)="dailogRef.close(false)">No</button>
 </div>

应该是

 <button  id= "YesButton" class="dialogButton"
    (click)="dialogRef.close(true)">Yes</button>
 <span class="flex1margin"></span>
 <button   id="NoButton" class="dialogButton"  
    (click)="dialogRef.close(false)">No</button>
 </div>

Mddialog在角4

1 个答案: