2016-10-04 2 views
0

이 대화 상자를 추가하는 것은 매우 복잡합니다.이 대화 상자는 나 자신을 추가 할 수없는 유일한 구성 요소입니다.사용 대화 상자가 매우 복잡합니다.

  1. 내 app.module.ts이 대화 상자를 만드는 방법
  2. 에 무언가를 추가해야하는 경우 나도 몰라? 나는 많은 정보가 있다는 것을 이해하지 못한다 Dialogreference

한 번 설정해야합니까? 내 루트 구성 요소 또는 무엇? 왜냐하면 일단 "모든 매개 변수 (?)"가 없으면 "제공자가없는 MdlDialogReference"를 가져 와서 그것을 생성자에 추가 할 수 있기 때문입니다.

실제 코드 :

FILE은

constructor(private vcRef: ViewContainerRef, 
       private dialog: MdlDialogReference, private dialogService: MdlDialogService, private httpService: HttpService, private communicationInsideServices : CommunicationInsideServices, private activatedRoute : ActivatedRoute, private router : Router) { 

    } 

    get viewContainerRef() { 
    return this.vcRef; 
    } 

이 오류가 app.component.ts? 내 애플 리케이션을로드하지 않기 때문에, 그리고 어떻게이 대화 상자를 다른 하위 컴포넌트로 호출 할 수 있습니까?

+0

왜 종속성으로 MdlDialogReference을 추가하는 방법은 무엇입니까? 귀하의 appcomponent를 대화의 내용으로 제시 하시겠습니까? – michael

+0

MdDialogReference가 무엇인지 모르겠다. 내 대화 내용으로 app 구성 요소를 원하지 않는다. 내 app.mobule.ts에 가져 오기가 필요하다.이 대화 상자를 구할 수있는 부트 스트랩 ngModule이 있어야한다. 때문에 작동하지 않거나 내가 잘못 사용하고있어, 당신은 명확한 plunkr 데모가 있다면, 환영합니다 – istiti

+0

내 코드를 깨끗하게하고 내 생성자에서 내 구성 요소에 juste 추가 : '생성자 (private dialogService : MdlDialogService)' 및 ngAfterViewInit 'let result = this.dialogService.alert ('간단한 경고입니다'); result.then (() => console.log ('alert closed')); ' 이 오류가 발생합니다. 'TypeError : 속성'parentInjector 'of undefined를 읽을 수 없습니다.' – istiti

답변

0

당신은 해결책에 가까웠습니다. 대화 상자가 연결되는 ViewContainerRef를 지정하는 것이 중요합니다.

constructor(private dialogService: MdlDialogService, 
    private viewContainerRef: ViewContainerRef){ 
    dialogService.setDefaultViewContainerRef(viewContainerRef); 
} 

이 한 번만 수행해야합니다 다음 app.component.ts에서이 작업 plnkr (http://plnkr.co/edit/HgAvCnzkWAmK1NVxfEUM?p=preview)에서 참조하시기 바랍니다. 각 showCustomDialog 호출에 viewConatinerRef을 제공 할 수는 있지만 루트 응용 프로그램의 생성자에서 한 번 수행하는 것이 더 쉽습니다. 이 누락 된 정보를 알려주는 오류 메시지가 있어야합니다 (곧 출시 될 예정).

버전 2.0.0 업데이트 : 더 이상 setDefaultViewContainerRef으로 전화하지 않아도됩니다. 그냥 html 파일에 dialog-outlet 요소를 추가 : 이 방법 :

<html> 
    <head>...</head> 
    <body> 
    <app-root>...</app-root> 
    <dialog-outlet></dialog-outlet> 
    </body> 
</html>