代码之家 › 专栏 › 技术社区 › Devanshu Kashyap

导入MatDialog组件时,对以下错误的修复是什么?

angular-material2 angular-material angular

1

Devanshu Kashyap · 技术社区 · 6 年前

用于以下导入

import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material';

我收到以下错误:

误差在 C:/users/321806119/tableapp/node_modules/@angular/material/list/typings/list.d.ts (26,31):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/autocomplete/typings/autocomplete.d.ts (83,69):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/core/typings/line/line.d.ts (20,70):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/core/typings/line/line.d.ts (28,53):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/core/typings/option/option.d.ts (64,27):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/core/typings/ripple/ripple.d.ts(C:/users/321806119/tableapp/node_modules/@angular/material/core/ty (74,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/core/typings/ripple/ripple-renderer.d.ts (77,69):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/autocomplete/typings/autocomplete-trigger.d.ts (106,27):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/autocomplete/typings/autocomplete-origin.d.ts (15,17):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/autocomplete/typings/autocomplete-origin.d.ts (18,17):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/badge/typings/badge.d.ts (52,63):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/bottom sheet/typings/bottom-sheet-container.d.ts (39,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/button toggle/typings/button-toggle.d.ts (151,21):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/button toggle/typings/button-toggle.d.ts (174104):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/checkbox/typings/checkbox.d.ts (88,20):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/checkbox/typings/checkbox.d.ts (99,29):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/chips/typings/chip-list.d.ts (46,28):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/chips/typings/chip-list.d.ts (176,30):类型“elementRef”不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/chips/typings/chip-input.d.ts (24,28):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/chips/typings/chip-input.d.ts (55,30):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/datepicker/typings/calendar-body.d.ts (65,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/datepicker/typings/datepicker-input.d.ts (84,30):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/expansion/typings/expansion-panel.d.ts (59,12):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/grid list/typings/grid-list.d.ts (32,27):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/grid list/typings/grid-tile.d.ts (16,27):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/grid list/typings/grid-tile.d.ts (30,27):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/icon/typings/icon.d.ts (86,29):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/text field/typings/autofill.d.ts (39,22):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/text field/typings/autofill.d.ts (49,29):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/text field/typings/autofill.d.ts (58,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/text field/typings/autosize.d.ts (37,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/input/typings/input.d.ts (29,28):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/input/typings/input.d.ts (100,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/core/typings/common behaviors/common-module.d.ts (9,10):模块 'C:/users/321806119/tableapp/node_modules/@angular/platform browser/platform browser'' 没有导出成员“hammerloader”。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/list/typings/list.d.ts (55,27):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/list/typings/selection-list.d.ts (62,27):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/list/typings/selection-list.d.ts (125,27):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/menu/typings/menu-directive.d.ts (110,30):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/menu/typings/menu-item.d.ts (34,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/menu/typings/menu-trigger.d.ts (78,46):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/radio/typings/radio.d.ts (184,20):类型“elementRef”不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/sidenav/typings/drawer.d.ts (29100):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/sidenav/typings/drawer.d.ts (86,30):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/sidenav/typings/drawer.d.ts (188,49):类型“elementRef”不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/sidenav/typings/sidenav.d.ts (12,99):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/slide toggle/typings/slide-toggle.d.ts (93,20):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/snack bar/typings/snack-bar-container.d.ts (35,47):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/stepper/typings/stepper.d.ts (145,92):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/stepper/typings/step-header.d.ts (11,28):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/stepper/typings/step-header.d.ts (12,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/stepper/typings/stepper.d.ts (49,89):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/stepper/typings/step-header.d.ts (36,82):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/table/typings/cell.d.ts (42,54):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/table/typings/cell.d.ts (50,54):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tabs/typings/ink-bar.d.ts (34,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tab/typings/tab-body.d.ts (80,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tooltip/typings/tooltip.d.ts (12,10):模块 'C:/users/321806119/tableapp/node_modules/@angular/platform browser/platform browser'' 没有导出成员“hammerloader”。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tooltip/typings/tooltip.d.ts (89,49):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tree/typings/node.d.ts (18,28):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tree/typings/node.d.ts (21,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tree/typings/node.d.ts (33,28):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/material/tree/typings/node.d.ts (38,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/tree/typings/nested-node.d.ts (33,28):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/tree/typings/nested-node.d.ts (42,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/tree/typings/tree.d.ts (90,28):“elementRef”类型不是一般类型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/tree/typings/tree.d.ts (109,30):“elementRef”类型不是泛型。误差在 C:/users/321806119/tableapp/node_modules/@angular/cdk/tree/typings/padding.d.ts (34,95):“elementRef”类型不是泛型。

package.json文件

{
  "name": "table-app",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^4.4.7",
    "@angular/cdk": "^7.2.1",
    "@angular/common": "^4.2.4",
    "@angular/compiler": "^4.2.4",
    "@angular/core": "^4.2.4",
    "@angular/forms": "^4.2.4",
    "@angular/http": "^4.2.4",
    "@angular/material": "^7.2.1",
    "@angular/platform-browser": "^4.2.4",
    "@angular/platform-browser-dynamic": "^4.2.4",
    "@angular/router": "^4.2.4",
    "ag-grid-angular": "^20.0.0",
    "ag-grid-community": "^20.0.0",
    "core-js": "^2.4.1",
    "hammerjs": "^2.0.8",
    "rxjs": "^5.4.2",
    "zone.js": "^0.8.14"
  },
  "devDependencies": {
    "@angular/cli": "1.4.10",
    "@angular/compiler-cli": "^4.2.4",
    "@angular/language-service": "^4.2.4",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "~3.2.0",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0",
    "typescript": "~2.3.3"
  }
}

有修复建议吗?

1 回复 | 直到 6 年前

1

Edric Prince Bansal 6 年前

正如@yuezui所指出的, ElementRef 现在是一个通用属性,您应该使用角度cdk/材质和角度的相同版本。

您还使用了不同版本的依赖项。角材V7最好安装在角材V7旁边。

(P.S.以下答案改编自 this answer )

您应该:

更新所有版本的Angular。

这可以通过运行 ng update @angular/core 它应该更新所有角度依赖项。

(有关 update 命令,查看 docs ,或者 Update Angular website )
将角度CDK和角度材质的版本降级为v4。

这可以通过运行以下命令来实现:
```
npm i @angular/{cdk,material}@'^4.0.0'
```
此命令应安装CDK和Angular Material的版本4。