这是一个示例。任何帮助都将受到赞赏!
@Component({
selector: 'component1',
template : `
<h3>{{title}}</h3>
<button (click)='dismiss()'>dismiss</button>
<ng-container *ngComponentOutlet="Component2;
injector: myInjector;
content: myContent">
</ng-container>
`
})
export class Component1 implements OnInit{
title : string = "hello!";
myInjector: Injector;
myContent: any;
constructor(private injector : Injector){
this.myInjector = ReflectiveInjector.resolveAndCreate([
{ provide : Component2, useClass : Component2 },
{ provide: TestObject, useFactory: ()=>
{
return new TestObject("123", "hello world!", "<h2>sample</h2>", "{"a":{"b":{"Value":"test"},"c":{"Value":"test 1"}}}");
}
}
], this.injector);
}
ngOnInit(){
var templateParent = document.createElement("div");
templateParent.innerHTML = "<h2>this is test html!</h2>";
this.myContent = [templateParent.childNodes];
}
dismiss(){
console.log('dismiss clicked!');
}
}
我在 Component1
中看不到 Component2
属性。因此,您将undefined
传递给*ngComponentOutlet
尝试以下
export class Component1 implements OnInit{
Component2 = Component2;
您有语法错误
"{"a":{"b":{"Value":"test"},"c":{"Value":"test 1"}}}"
您应该将其用作
'{"a":{"b":{"Value":"test"},"c":{"Value":"test 1"}}}'
分叉plunker