Angular Material 및 Jasmine : " 주입을 위한 공급자 없음토큰 MdDialogData!"

Angular Material 및 Jasmine : " 주입을 위한 공급자 없음토큰 MdDialogData!"

Angular Material MdDialog에 사용해야 하는 구성 요소가 있습니다.

@Component({
  ...
})
export class MyComponent {

  constructor(@Inject(MAT_DIALOG_DATA) public data: any, public dialogRef: 
MdDialogRef<MyComponent>) {
...
  }


}

자스민과 함께 Unit Test 하려고 합니다.

describe('MyComponent', () => {
  let component: MyComponent;
  let fixture: ComponentFixture<MyComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        SharedTestingModule,
      ],
      declarations: [
        MyComponent,
      ],
    })
    .compileComponents();
  }));

  ...
  
});

유감스럽게도 다음 오류가 발생했습니다.

오류: 주입할 공급자가 없습니다.토큰 MdDialogData!

SharedTestingModule은 사용자 지정 Angular Material 모듈을 가져오고 내보냅니다. 이 모듈은 자체적으로 MdDialogModule을 가져오고 내보냅니다.

어떻게 하면 이 오류를 없앨 수 있습니까?

감사합니다!

Angular 4.2.4
Angular Material 2.0.0-beta.7
Jasmine 2.5.3

추가한 내용:

providers: [
    { provide: MAT_DIALOG_DATA, useValue: {} },
    // { provide: MdDialogRef, useValue: {} }, --> deprecated
    { provide: MatDialogRef, useValue: {} } ---> now
]

그리고 효과가 있습니다 :)

@methgard님의 도움에 감사드립니다!

최신 재료 구성요소가 있는 Angular 5용

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

그리고.

 providers: [
     { provide: MAT_DIALOG_DATA, useValue: {} },
     { provide: MatDialogRef, useValue: {} }
 ]

이것을 먹어보세요.

beforeEach(async(() => {
 TestBed.configureTestingModule({
   imports: [
     SharedTestingModule,
   ],
   declarations: [
     MyComponent,
   ],
   providers: [ <-- here
    {
     provide: MdDialogData,
     useValue: {},
    }
   ] <-- to here 
 })
 .compileComponents();
}));

어떻게 되어 가는지 나에게 알려줘.

업데이트로, 이것은 접두사 "매트"가 있는 태그를 사용하는 사람들에게도 복제됩니다.

providers: [{provide: MAT_DIALOG_DATA, useValue: {}}, 
{provide: MatDialogRef, useValue: {}}]

Angular Optional decorator를 사용할 수 있습니다. 이전에 이 문제에 직면한 적이 있습니다.

구성 요소가 팝업으로 사용되지 않는 경우 이 스니펫을 사용해 보십시오.

constructor(
  @Optional() public dialogRef: MatDialogRef<PopupComponent>,
  @Optional() @Inject(MAT_DIALOG_DATA) public data: any
) {}

공급자를 지정하지 않고 재스민 검정에서 MAT_DIALOG_DATA / MAT_BOTTOM_SHEET_DATA를 주입할 수 있습니다.주입되는 값이 null인지 확인하기만 하면 됩니다. null이면 컴파일러가 존재하지 않는 공급자의 null 값을 실수하여 공급자를 찾을 수 없음 오류가 발생합니다.

에 추가해 보십시오.<x>.component.spec.ts아래providers:

{ provide: MatDialog, useValue: {} }

경우에 따라 다음이 필요합니다.

{ provide: MatDialogRef, useValue: {} }

(이 방법은 나의 각진 11 프로젝트에서 일하는 것입니다)

주입을 위한 공급자 없음토큰 매트 대화 상자 데이터!,이 오류는 테스트 사례를 실행할 때 발생합니다. 관련 구성 요소에서 @Inject(MAT_DIALOG_DATA) 공용 값: string이 있는 matdialog 참조를 사용할 때 발생합니다.

spec.ts 파일에 아래 코드 추가

제공자: [MatDialogModule, {제공: MAT_DIALOG_DATA, useValue: {}}, {제공:MatDialogRef, useValue: {}]

언급URL : https://stackoverflow.com/questions/44826518/angular-material-and-jasmine-no-provider-for-injectiontoken-mddialogdata