elementRef.createComponent가 함수가 아닙니다

Question

버튼을 클릭 할 때 스피너 구성 요소를 동적으로로드하려고합니다.

Plunker 링크는 여기에 내가 오류가 아래 얻고있다

http://plnkr.co/edit/UEEQQRzX7RIkSO49rCHu?p=preview

let elementRef: ElementRef = this.appRef['_rootComponents'][0].location; 

    return this.startInside(elementRef, null); 

입니다 :

elementRef.createComponent is not a function.

제안하십시오!

Answer 1

나는 당신의 plunkr 적응하고 here에 갈래하지만 요약이 작업을 수행해야했습니다

다음, 템플릿에 자리 표시 자 추가 @ViewChild으로 지정하고 서비스에 그것을 전달합니다. 여기에 지금 app.ts입니다 :

@Component({ 
    selector: 'my-app', 
    providers: [SpinnerService], 
    template: ` 
    <div> 
     <button type="button" (click)="showSpinner()">Show Spinner</button> 
     <div #spinner></div> 
    </div> 
    ` 
}) 
export class App { 
    @ViewChild('spinner', { read: ViewContainerRef }) container: ViewContainerRef;  

    constructor(private _spinner: SpinnerService) {} 

    showSpinner() { 
    this._spinner.start(this.container); 
    setTimeout(() => this._spinner.stop(), 5000); 
    } 
} 

그리고 마지막으로 서비스에 방금이 수행 할 수

public start(placeholder) { 
     let elementRef = placeholder; 
     return this.startInside(elementRef, null); 
    }