Question

我正在尝试在angular2中执行mdDidalog，但它显示我这样：

出了点问题...... 我下一步导入：

import { MdDialog, MdDialogRef, MdDialogConfig } from '@angular/material';

构造

  constructor(
      public dialog: MdDialog,
      public viewContainerRef: ViewContainerRef
    ){}

其函数调用新模态：

  public openAddPromoModal() {
const config = new MdDialogConfig();
config.viewContainerRef = this.viewContainerRef;

const dialogRef = this.dialog.open(AddNewCandidat, {
  height: '400px',
  width: '600px'})

dialogRef.afterClosed().subscribe(newPromo => {
    });
  }
}

我的index.html

<!DOCTYPE html>
<html>
  <head>
    <base href="/">
    <title>Angular With Webpack</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="https://unpkg.com/@angular/material/prebuilt-themes/indigo-pink.css" rel="stylesheet">
  </head>
  <body>
    <my-app>Loading...</my-app>
  </body>
</html>

Answer 1

您的功能应该是

public openAddPromoModal() {
    const config = new MdDialogConfig();
    config.width = '600px';
    config.height: '400px';

const dialogRef = this.dialog.open(AddNewCandidat, config);

dialogRef.afterClosed().subscribe(newPromo => {
    });
  }
}

角度2 mdDialog不重叠

1 个答案: