.16
dcl.loadIntoLocation() ViewContainerRef .
@Component({
selector: 'dynamic',
template: `
<h1 (click)="null">I'm the dynamic component</h1>
<button (click)="someEvent.emit($event)">click me</button>
`,
})
export class DynamicComponent {
someEvent = new EventEmitter();
}
@Component({
selector: 'my-app',
template: `
<h1>Hello</h1>
<div>
<div>clicked at (top): {{top}}</div>
<span>dynamic component below</span>
<div #target></div>
</div>
`,
})
export class AppComponent {
@ViewChild('target', {read: ViewContainerRef}) target;
top;
constructor(private dcl:DynamicComponentLoader) {}
ngAfterViewInit() {
this.dcl.loadNextToLocation(DynamicComponent, this.target)
.then(ref => {
ref.instance.someEvent
.subscribe(value => {
console.log(value.clientX);
this.top = value.clientX;
console.log(this.top);
})
});
}
}
beta.17
loadIntoLocation(
SomeComponent,
someElementRef,
'someAnchor',
[/*other providers, */
provide(ParentComponent, useValue: this)]);
.
constructor(parent: ParentComponent) {}
, .