私はこれを多くの方法で試してみたところ、ドキュメントを作成してそれを起動し、少なくともAngular Materialを実行しようとしました。角4 MatDialogRefのプロバイダはありません! (ウェブパック)
私は私のコンソールで次のエラーを取得しています:
core.es5.js:1020 ERROR Error: Uncaught (in promise): Error: No provider for MatDialogRef!
コード:HTMLで
import {Component, Inject} from '@angular/core';
import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from '@angular/material';
@Component({
selector: 'replace-office',
templateUrl: 'replace-office.component.html',
styleUrls: ['replace-office.component.css']
})
export class ModalMessageReplaceComponent {
someValue: boolean = false;
constructor(public dialogRef: MatDialogRef<ModalMessageReplaceComponent>,
@Inject(MAT_DIALOG_DATA) public data: any) { }
onNoClick(): void {
this.dialogRef.close(this.someValue);
}
}
:
<li>
<button mat-raised-button (click)="onNoClick()">Pick one</button>
</li>
Dependencies in the package.json file
"dependencies": {
"@angular-redux/store": "6.5.7",
"@angular/animations": "4.4.6",
"@angular/cdk": "^2.0.0-beta.12",
"@angular/common": "4.4.6",
"@angular/compiler": "4.4.6",
"@angular/core": "4.4.6",
"@angular/forms": "4.4.6",
"@angular/http": "4.4.6",
"@angular/material": "^2.0.0-beta.12",
"@angular/platform-browser": "4.4.6",
"@angular/platform-browser-dynamic": "4.4.6",
"@angular/router": "4.4.6",
"@angular2-material/core": "^2.0.0-alpha.8-3",
"X-editable": "github:vitalets/x-editable",
"angular-moment": "^1.1.0",
"angular-tree-component": "^5.1.2",
"bootstrap": "3.3.7",
"bootstrap-colorpicker": "2.5.2",
"bootstrap-duallistbox": "github:istvan-ujjmeszaros/bootstrap-duallistbox",
"bootstrap-markdown": "2.10.0",
"bootstrap-progressbar": "0.9.0",
"bootstrap-slider": "9.9.0",
"bootstrap-tagsinput": "0.7.1",
"bootstrap-timepicker": "0.5.2",
"chart.js": "2.7.1",
"classlist.js": "^1.1.20150312",
"clockpicker": "0.0.7",
"clone": "2.1.1",
"core-js": "2.5.1",
"debounce": "1.1.0",
"dropzone": "5.2.0",
"dygraphs": "2.0.0",
"fuelux": "3.16.2",
"hammerjs": "^2.0.8",
"he": "1.1.1",
"highcharts": "6.0.2",
"intl": "^1.2.5",
"ion-rangeslider": "2.2.0",
"jquery": "3.2.1",
"jquery-color": "1.0.0",
"jquery-jcrop": "0.9.13",
"jquery-knob": "1.2.11",
"jquery-ui-npm": "1.12.0",
"jquery-validation": "1.17.0",
"jquery.maskedinput": "1.4.1",
"markdown": "0.5.0",
"mdn-polyfills": "^5.0.0",
"moment": "^2.19.1",
"morris.js": "0.5.0",
"ngx-bootstrap": "^1.6.6",
"ngx-popover": "0.0.16",
"nouislider": "10.1.0",
"npm": "^5.3.0",
"raphael": "2.2.7",
"redux": "3.7.2",
"rxjs": "5.5.2",
"scriptjs": "2.5.8",
"select2": "4.0.6-rc.0",
"smartadmin-plugins": "1.0.20",
"to-markdown": "3.1.0",
"ts-helpers": "1.1.2",
"web-animations-js": "^2.2.5",
"zone.js": "0.8.18"
},
この問題はアンギュラ2の前に現れました。しかし、私は現在オープンチケットを見つけることができません。以前誰かがこの問題を遭遇しましたか?
-------------------
In私は次のインポートを追加してい@NgModule
:そうすることで
import {MAT_DIALOG_DATA, MatDialog, MatDialogRef} from '@angular/material';
@NgModule({
imports: [
CommonModule,
SmartadminModule,
ManageRolesRoutingModule,
Tree,
BsDropdownModule,
MatDialog
],
は、新たなエラーが発生します。
Error: Unexpected value 'MatDialog' imported by the module 'ManageRolesModule'. Please add a @NgModule annotation.
Error: Unexpected value 'MatDialog' imported by the module 'ManageRolesModule'. Please add a @NgModule annotation.
それから私は、新しい方法を試してみましたが、NgModuleのうち、輸入を取っ:
export class ModalMessageReplaceComponent {
someValue: boolean = false;
constructor(public dialogRef: MatDialogRef<ModalMessageReplaceComponent>) { }
onNoClick(): void {
this.dialogRef.close(this.someValue);
}
}
この結果は元のエラーに戻ります。 Error: No provider for MatDialogRef!
----------------------------更新2 --------------- BASICAであるあなたが@angular2-material/core
をアンインストールする必要が--------
Uncaught (in promise): Error: No provider for MatDialogRef!
@NgModuleでインポートしましたか? –
@H.Hakvoortはアップデート1を参照してください。 – Drew1208