CODEWITHSUNDEEP
angulartypescriptangular9
Francis Ducharme
Francis Ducharme

Reputation: 4987

Getting the width of all child components contained in an NgTemplate

I've got this markup in the template. I can iterate through its component using get but it's not returning an object which allows me to dig deep enough in the HTML attributes.

<ng-template #container></ng-template>

I dynamically add components to this container above.

My component code

@ViewChild("container", { read: ViewContainerRef }) appAsideContainer: ViewContainerRef;


for (var x = 0; x < this.appAsideContainer.length; x++) {
    let c: ViewRef = this.appAsideContainer.get(x);
    console.log(c);
}

c doesn't give me access to either element or nativeElement so I could get offsetWidth

Is there any other way to achieve this ?

Upvotes: 1

Views: 380

Answers (1)

yurzui
yurzui

Reputation: 214017

It can be achieved by using rootNodes property after casting to EmbeddedViewRef:

for (var x = 0; x < this.appAsideContainer.length; x++) {
  const viewRef = this.appAsideContainer.get(x) as EmbeddedViewRef<any>;
  const rootNode = viewRef.rootNodes[0];
  console.log(rootNode);
}

Upvotes: 2

Related Questions