angular - DynamicComponentLoader.loadIntoLocation 不是 Angular2 中的函数错误

Question

我正在尝试使用DynamicComponentLoader，示例代码如下:

import {Component, View, bootstrap,  OnInit, DynamicComponentLoader} from 'angular2';

...

DynamicComponentLoader.loadIntoLocation(PersonsComponent, itemElement);

当我运行应用程序时，出现错误:

DynamicComponentLoader.loadIntoLocation is not a function

如何使用类在 ES6 JavaScript 中使用 DynamicComponentLoader.loadIntoLocation？

Answer 1

DynamicComponentLoader 是类。它没有任何静态方法loadIntoLocation。但这个类的实例有它。您必须使用依赖项注入(inject)实例化 DynamicComponentLoader:

import { Component, View, DynamicComponentLoader, ElementRef } from 'angular2/angular2'

@Component({
  selector: 'dc'
})
@View({
  template: '<b>Some template</b>'
})
class DynamicComponent {}

@Component({
  selector: 'my-app'
})
@View({
  template: '<div #container></div>'
})
export class App {

  constructor(
    dynamicComponentLoader: DynamicComponentLoader, 
    elementRef: ElementRef
  ) {
    dynamicComponentLoader.loadIntoLocation(DynamicComponent, elementRef, 'container');
  }
}

参见this plunker

UPD

ES6呢，我已经回答过here