大佬教程收集整理的这篇文章主要介绍了html – Angular2 – 将div添加到DOM，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
我想要做的是“模仿”JQuery追加功能.在Angular2中有没有办法做到这一点？
非常感谢你的帮助！
这是我的组件：
import { Component,ViewChild,ElementRef } from '@angular/core'; @Component({ modulEID: module.id,SELEctor: 'my-SELEctor',template: `<div #builder class="row"> <div class="s12 teal lighten-2"> <p class="flow-text">teste do html builder</p> </div> </div> <a class="btn-floaTing btn-large waves-effect waves-light red" (click)="addRow()"><i class="material-icons">add</i></a>`,}) export class BuilderComponent { @ViewChild('builder') builder:ElementRef; ngAfterViewInit() { console.log(this.builder.nativeElement.innerHTML); } addRow() { let htmlText = `<div #row class="row"> <div class="s12 teal lighten-2"> <p class="flow-text">div inside parent - html builder</p> </div> </div>`; this.builder.nativeElement.append(htmlText); (???) } }
<div [innerHtml]="htmlText"></div>
零件：
export class BuilderComponent { htmlText: String; ngAfterViewInit() { } addRow() { this.htmlText = this.htmlText + `<div #row class="row"> <div class="s12 teal lighten-2"> <p class="flow-text">div inside parent - html builder</p> </div> </div>`; } }
我将正确使用的另一个解决方案是创建一个字符串数组,并使用*ngFor和一个模板循环它.通过这样做,可以避免使用打字稿中的HTML,并且每次有更新时都不需要编辑html这两个位置.
例如：
模板：
<div *ngFor="let row of rows" class="row">
<div class="s12 teal lighten-2">
<p class="flow-text">{{ row }}</p>
</div>
</div>
零件：
export class BuilderComponent { rows: Array<String> = new Array(); ngAfterViewInit() { } addRow() { this.rows.push("Test 123 text"); } }
以上是大佬教程为你收集整理的html – Angular2 – 将div添加到DOM全部内容，希望文章能够帮你解决html – Angular2 – 将div添加到DOM所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。