角度材质对话框显示不正确

Question

在用最新版本10更新软件包之前，我的棱角材质对话框运行良好。我不知道我的依赖项或代码中缺少什么。

它可能与新的Angular编译器Ivy或Angular材质库有关。

这是我的package.json文件-

"dependencies": {
  "@angular/animations": "^10.0.1",
  "@angular/cdk": "^10.0.0",
  "@angular/common": "^10.0.1",
  "@angular/compiler": "^10.0.1",
  "@angular/core": "^10.0.1",
  "@angular/forms": "^10.0.1",
  "@angular/material": "^10.0.0",
  "@angular/platform-browser": "^10.0.1",
  "@angular/platform-browser-dynamic": "^10.0.1",
  "@angular/router": "^10.0.1",
  "@popperjs/core": "^2.4.2",
  "animate.css": "^4.1.0",
  "bootstrap": "^4.5.0",
  "crypto-js": "^4.0.0",
  "font-awesome": "^4.7.0",
  "jquery": "^3.5.1",
  "rxjs": "~6.5.4",
  "tslib": "^1.10.0",
  "zone.js": "~0.10.2"
},
"devDependencies": {
  "@angular-devkit/build-angular": "^0.1000.0",
  "@angular/cli": "^10.0.0",
  "@angular/compiler-cli": "^10.0.1",
  "@angular/language-service": "~9.0.7",
  "@types/jasmine": "~3.5.0",
  "@types/jasminewd2": "~2.0.3",
  "@types/node": "^12.11.1",
  "codelyzer": "^5.1.2",
  "jasmine-core": "~3.5.0",
  "jasmine-spec-reporter": "~4.2.1",
  "karma": "^5.1.0",
  "karma-chrome-launcher": "~3.1.0",
  "karma-coverage-istanbul-reporter": "~2.1.0",
  "karma-jasmine": "~2.0.1",
  "karma-jasmine-html-reporter": "^1.4.2",
  "protractor": "^7.0.0",
  "ts-node": "~8.3.0",
  "tslint": "~5.18.0",
  "typescript": "^3.9.5"
}

这是我的app.module.ts文件，其中显示entryComponents，这是材质对话框所需要的。因此，您看到我没有犯不添加entryComponents的最常见错误。

entryComponents: [
    VoucherDialogBoxComponent, 
    DateNoticeDialogBoxComponent, 
    ReportDialogBoxComponent, 
    EditTransactionDialogBoxComponent, 
    DeleteConfirmDialogBoxComponent,
    BeforeBaseYearWarningDialogBoxComponent
  ],

HTML在左下角附近显示良好，并且没有出现在屏幕中间作为弹出窗口。