我在我的角度app中使用MDDialog。每当用户点击div时,
有人可以建议我该怎么做以避免上述问题?
调用对话框:
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 = '';
}
对话框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>) {
}
}
当你在对话框对象上调用.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>