角度5：从组件访问元素内部html以获取动态生成的元素

Question

我的组件中有一个角度组件，我需要访问element的内部html。为此，我可以将ViewChild与模板ref一起用于单个元素。但是在ngFor中，当我动态生成元素和模板ref时，它不起作用。这是控制台中显示的错误：-

Cannot read property 'native Element' of undefined

这是单个元素的代码：-

@ViewChild('emailBodyContainer') emailBodyContainer: ElementRef;
<div [innerHtml]="emailTemplate.mailBody" #emailBodyContainer>

对于动态元素：-

<div *ngFor="let i of reminderTemplates" class="container tab-pane text-center py-4 [innerHtml]="i.mailBody" #{{i.type}}></div>

请帮我解决这个问题。提前致谢 ：）

Answer 1

You can use something like this.

<div *ngFor="let i of reminderTemplates" class="container tab-pane text-center py-4 [innerHtml]="i.mailBody" #items></div>

In component:

@ViewChildren('items') items: QueryList<ElementRef>;

console.log(this.items); // print the list of items