undefinedfix
Sign in

How does angular output subcomponents in a component template (to get subcomponent objects)

sbpjs edited in Fri, 27 May 2022

Problem description

Now I need to control the display mode of the child component. I have obtained the object instance of the child component, but how can I display this object in the template of the parent component?

The background of the problem and what methods have you tried

< ng template [ngcomponentoutlet] = child [0] > < / ng template > this is not OK

Related codes

import { Component, OnInit, ViewContainerRef, TemplateRef, ContentChildren, AfterViewInit } from '@angular/core';
import { ISelectItem } from './item-interface';
@Component({
  selector: 'zzj-table-tool-select',
  templateUrl: './table-tool-select.component.html',
  styleUrls: ['./table-tool-select.component.scss']
})
export class TableToolSelectComponent implements OnInit,AfterViewInit {
  children: ISelectItem[] = [];
  @ContentChildren('child') child;
  constructor() { }

  ngOnInit() {
  }
  public addItem(item: ISelectItem) {
    this.children.push(item);
  }
  ngAfterViewInit() {
    console.log('--------');
    console.log(this.child)
  }
}
2 Replies
suxbr
commented on Fri, 27 May 2022

Grammar sugar:

<ng-container *ngComponentOutlet="ctrl"></ng-container>

Direct reference to subcomponent classes without class instances.

Take a look at the official website

pmioo
commented on Fri, 27 May 2022

Ng content is wrong. You didn't output the instance you got? Or do you just write

@ContentChildren('child') child;

But there is no corresponding code in the template? In this way, the instance cannot be obtained

lock This question has been locked and the reply function has been disabled.