想要在DOM中附加动态生成的html,它在DOM中成功附加,但是没有一个函数像点击等一样工作。
ngOnInit() {
this.sideBarData += '<li class="sidebar-toggler-wrapper hide" >' +
'<div class="sidebar-toggler" > </div>' +
'</li>' +
'<li class="sidebar-search-wrapper"></li>';
this.sideBarData += '<li class="nav-item start">' +
'<a class="nav-link home name" (click)="HomeButton(event)">' +
'<i class="fa fa-home"></i>' +
'<span class="title">Home</span>' +
'</a>' +
'</li>';
this.getJSONService.getData()
.subscribe(response => {
var value=response.datas
if (value.length > 0) {
for (var i = 0; i < value.length; i++) {
if (value[i].state)
{
this.sideBarData += '<li class="nav-item" >' +
'<a (click)="parentNav($event)" routerLink="/' + value[i].state + '" class="nav-link nav-toggle ' + value[i].key + '" >' +
'<i class="fa fa-' + value[i].label_Icon + '"></i>' +
'<span class="title">' + value[i].label + '</span>';
if (this.checkDataExist(value[i]))
{
var data1 = this.data(value[i]);
}
this.sideBarData += '</a></li>';
} else
{
this.sideBarData += '<li class="nav-item" >' +
'<a class="nav-link nav-toggle ' + value[i].key + '" (click)="parentNav($event)">' +
'<i class="fa fa-' + value[i].label_Icon + '"></i>' +
'<span class="title">' + value[i].label + '</span>';
if (this.checkDataExist(value[i]))
{
var data1 = this.data(value[i].data);
}
this.sideBarData += '</a></li>';
this.sidebarChild.element.nativeElement.innerHTML=this.sideBarData
}
}
}
})
}
数据附加在DOM中,但没有任何事件调用正在运行..
你能帮忙吗? 提前谢谢。答案 0 :(得分:0)
直接在 DOM 中设置 html 并不是正确的做事方式的 角 即可。 正确的方法是将您的代码分成 组件 ,其中每个组件都应该拥有自己的责任(S.O.L.I.D。中的S.)。
对于这种 interactivaty (显示/隐藏,样式),你应该使用: ngIf , ngSwitch , ngClass 在模板中。