Можно ли вручную создать экземпляр компонента в angular 2

в angular 2 Можно ли вручную создать экземпляр компонента A, затем передать его и отобразить в шаблоне компонента B?

6
angular angular2-components

1 ответов

Да, это поддерживается. Вам нужно ViewComponentRef это может быть получено, например, путем инъекции его в конструктор или с помощью @ViewChild('targetname') запрос и ComponentResolver Это также можно впрыснуть.

этот пример кода из https://stackoverflow.com/a/36325468/217408 позволяет, например, динамически добавлять компоненты с помощью *ngFor

@Component({
  selector: 'dcl-wrapper',
  template: `<div #target></div>`
})
export class DclWrapper {
  @ViewChild('target', {read: ViewContainerRef}) target;
  @Input() type;
  cmpRef:ComponentRef;
  private isViewInitialized:boolean = false;

  constructor(private resolver: ComponentResolver) {}

  updateComponent() {
    if(!this.isViewInitialized) {
      return;
    }
    if(this.cmpRef) {
      this.cmpRef.destroy();
    }
   this.resolver.resolveComponent(this.type).then((factory:ComponentFactory<any>) => {
      this.cmpRef = this.target.createComponent(factory)
    });
  }

  ngOnChanges() {
    this.updateComponent();
  }

  ngAfterViewInit() {
    this.isViewInitialized = true;
    this.updateComponent();  
  }

  ngOnDestroy() {
    if(this.cmpRef) {
      this.cmpRef.destroy();
    }    
  }
}
0