angular - 出现Angular4 MdDialog，但里面没有显示html

Question

我不确定为什么我的对话框中的 html 没有显示

这是我的应用程序和对话框组件。所有导入似乎都正常工作，并且我在浏览器控制台中没有收到任何错误消息。

import { Component, Input } from '@angular/core';
import {MdDialog, MdDialogRef} from '@angular/material';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent {
  dialogRef : MdDialogRef<Dialog>;
  title = 'Code Share app';
  admin = false;
  userID : string = "";

  constructor(public dialog: MdDialog ){
    this.openDialog();
  }

  openDialog() {
  this.dialogRef = this.dialog.open(Dialog);
  this.dialogRef.afterClosed().subscribe(result => {
    console.log(result);
    this.dialogRef = null;
  });
 }

}


@Component({
  selector: 'dialog',
  template: `<h1>Dialog</h1>
  <div md-dialog-content>What would you like to do?</div>
  <div md-dialog-actions>
    <button md-button (click)="dialogRef.close('Option 1')">Option 1</button>
    <button md-button (click)="dialogRef.close('Option 2')">Option 2</button>
  </div>
  <p>hello</p>`,
})

export class Dialog {
  constructor(public dialogRef: MdDialogRef<Dialog>){}
}

Answer 1

事实证明，HTML 选择器“对话框”与我正在使用的库之一中的选择器存在命名空间冲突。我更改了名称并且它起作用了。