google-chrome - 为什么 Angular Material Dialog 组件没有在 Google Chrome 中显示？

Question

该对话框在 Firefox 中运行良好。在 Chrome 中，点击事件只显示一个没有内容或按钮的小空对话框。我正在研究 this例如，当我遇到问题时。

对话框组件:

@Component({
selector: 'dialog',
template: `
        <h1 md-dialog-title class="primary-color">hey title</h1>
        <md-dialog-content class="accent-color">
          hey this is the content of the dialog
        </md-dialog-content>
        <md-dialog-actions>
          <button md-raised-button color="primary" md-dialog-close>
            close button
          </button>  
        </md-dialog-actions>
`
})

应用组件 html:

<div>
  <button md-raised-button color="primary" (click)="openDialog()">
    Example Dialog - Click Me!
  </button>
</div>

应用组件函数:

constructor(public dialog: MdDialog) {}

openDialog() {
  this.dialog.open(DialogComponent);}

我必须做些什么才能让它在 Google Chrome 浏览器中正常工作？

Answer 1

当我从 DialogComponent 中删除选择器时，问题停止了:

selector: 'dialog',