Angular2没有提供ViewUtils

Question

所以我搜索谷歌找不到任何关于这个例外。

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

所以我找到了一种让它工作的方法，现在已经足够好了，但我猜测并不是很好的做法。

解决方案：我没有使用reflectionInjectors左右，只是调用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);