Angular2 ViewUtilsのプロバイダがありません

Question

Googleはこの例外に関して何も検索できませんでした。

platform-browser.umd.js:1900 EXCEPTION: Error: Uncaught (in promise): No provider for ViewUtils! 

私が作成し、動的にコンポーネントを挿入し、オブジェクトでそれを注入されてやろうとしています：

作成は、次のようになりますんだから私の基本クラス：

import { Component, OnInit, AfterViewInit, OnDestroy, ComponentResolver, ViewContainerRef, Injector, ReflectiveInjector, provide} from '@angular/core'; 
... 
import { customNode } from '../my-own-types/backend.types'; 
import { LandingComponent } from '../../pages/landing/landing.component'; 

@Component({ 
    moduleId: module.id, 
    template: '<template #page_content></template>)', 
    providers: [ NodeService ] 
}) 

export class BaseComponent implements OnInit, AfterViewInit, OnDestroy { 
    private error:string | boolean = false; 
    private cmpRef:any; 

    constructor(
     private _injector: Injector, 
     private VCR: ViewContainerRef, 
     private CR: ComponentResolver 
    ) {} 

    ... 

    ngAfterViewInit() { 
     ... //getting node from service 
     if (node) { 
      let resolvedProviders = ReflectiveInjector.resolveAndCreate([ 
        provide(customNode, {useValue: node}) 
       ]); 
      // let child = ReflectiveInjector.fromResolvedProviders(resolvedProviders, this._injector); 
      switch (node.type || '') { 
       case 'landing' : 
        this.CR.resolveComponent(LandingComponent).then((factory) => { 
         this.cmpRef = this.VCR.createComponent(factory, 0, resolvedProviders, []); 
        }); 
       break; 
       default: { 
        console.log("BASE COMPONENT: ERROR!!!!"); 
       } 
      } 
     } 
    } 
    ... 
} 

私のLandingComponentのコンストラクタでは、次のようなことをしたいと考えています：

constructor(
     private node: customNode, 
     private _injector: Injector) { 

     console.log("Landing page constructed"); 

     this.loadNode = (node) => { 
      this.content = node.content; 
      this.created = node.created; 
     } 
     if (!this.node) 
      this.node = _injector.get("node"); 
     if (this.node) 
      this.loadNode(this.node) 
    } 

Answer 1

So私はそれを働かせる方法を見つけました。これは今のところ十分ですが、私は本当に良い練習ではないと推測しています。

解決策：私はreflectiveInjectorsなどを使用していません。単にLandingComponent内で定義された関数を呼び出します。

私が今持っている私のbaseComponent、AfterViewInitで

：

ngAfterViewInit() { 
    ... //Code to get node 
    if (node) { 
     switch (node.type || '') { 
      case 'page' : 
       this.CR.resolveComponent(LandingComponent).then((factory) => { 
        this.VCR.clear(); 
        this.cmpRef = this.VCR.createComponent(factory, 0, this._injector, []); 
        this.cmpRef.instance.loadNode(node); 
        return this.cmpRef; 
       }); 
      break; 
      default: { 
       console.log("BASE COMPONENT: ERROR!!!!"); 
      } 
     } 
    } 
} 

マイLandingComponentが今のようになります。

constructor(private node: customNode, private _injector: Injector) {} 

loadNode(node) { 
    this.content = node.content; 
    this.created = node.created; 
} 

Answer 2

は、あなたが親インジェクターを追加しようとしたことがありますか？

let resolvedProviders = ReflectiveInjector.resolveAndCreate([ 
       provide(customNode, {useValue: node}) 
      ], this._injector);