0

这是我的代码..

<i id="lrbp" #lrbp data-toggle="popover" [attr.data-content]="popovercontent" data-placement="bottom" (click)="openSettingPopOver(lrbp)" class="btn btn-default fa fa-cog fa-lg" aria-hidden="true"></i>

数据内容将在 .ts 文件中生成，例如。

initPopOverContent(){
    this.popovercontent = "<ul class='list-group' style='margin:0'>" +
        "<li type='button' (click)='draw3D()' class='list-group-item'><i class='fa fa-cubes' aria-hidden='true'></i> 3D Chart</li>" +
        "<li type='button' class='list-group-item'><i class='fa fa-line-chart' aria-hidden='true'></i> Line Chart</li>" +
        "<li type='button' class='list-group-item'><i class='fa fa-pie-chart' aria-hidden='true'></i> Pie Chart</li>" +
        "</ul>";    
}

openSettingPopOver(id: any) {
    this.popover = id;
    let template: string = '<div class="popover" style="min-width:10em" role="tooltip"><div class="arrow"></div><h3 class="popover-title"></h3><div class="popover-content" style="padding:0"></div></div>';

    $(id).popover({ html: true, template: template }).popover('toggle');
}

但是点击事件

(click)='draw3D()' 这个函数在同一个.ts文件中

没有被调用。

我知道原因可能是在 angular 2 中动态附加 html 标签的方式不正确。

如果他们解决了类似的问题，任何人都可以帮助我。

4

1 回答 1

0

这是不支持的。动态添加的 HTML 只是传递给浏览器并进行清理（被潜在危险的 HTML、CSS 等剥离），但不会创建 Angular2 绑定或组件和指令。

于 2016-07-31T15:09:19.093 回答