使用Angular 2中的viewchild更新元素的innerhtml [英] Update innerhtml of element using viewchild in angular 2

问题描述

我有类似

<section class="" #hiddenElement>
    <span>title</span>
    <span class="value"></span>
</section>

我使用

@ViewChild('hiddenElement') hiddenElement: ElementRef;

如何更新其类为value的元素的innerhtml?

How do i update the innerhtml of element whose class is value?

推荐答案

您可以获取hiddenElement 孩子使用nativeElement.children，通过className对其进行过滤，并使用

You can get hiddenElement children using nativeElement.children, filter them by className and modify their innerHTML using element.innerHTML

类似这样的东西

Array
    .from(this.hiddenElement.nativeElement.children)
    .filter(c => c.className.includes('value'))
    .forEach(c => c.innerHTML = 'New innerHTML');

plnkr

这篇关于使用Angular 2中的viewchild更新元素的innerhtml的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！