在Polymer中动态生成HTML的数据绑定? [英] Data binding for dynamically generated HTML in Polymer?

问题描述

当我在<template> -tag中写入以下内容时，一切正常:

When I write the following inside my <template>-tag, everything works fine:

<ul id="breadcrumbList" class="breadcrumb">
    <li><a on-click="{{breadcrumbClick}}">{{overviewName}}</a></li>
</ul>

我动态生成了一个新的具有相同结构的<li>元素，如下所示:

I dynamically generated a new <li>-element of the same structure, like this:

crumb = document.createElement("li");
crumb.innerHTML = '<a on-click="{{breadcrumbClick}}">'+category+'</a>';

但是当我单击此元素时，不会调用事件处理程序.

But when I click this element, the event-handler isn't called.

事件处理程序如下:

breadcrumbClick: function(event, detail, sender) {
     /*reaction*/
}

我没有找到有关是否有可能对动态生成的内容使用数据绑定的文档.

I did not find any documentation about whether it's possible or impossible to use data binding for dynamically generated content.

推荐答案

这对于injectBoundHTML()是可能的.我们尚未对其进行文档记录，但是您可以在此处查看方法签名和演示: https://github.com/Polymer/docs/issues/607

This is possible with injectBoundHTML(). We haven't documented it yet, but you can see the method signature and demo here: https://github.com/Polymer/docs/issues/607

示例:

<li id="myli></li>

this.injectBoundHTML('<a on-click="{{breadcrumbClick}}">...</a>', this.$.myli);

这篇关于在Polymer中动态生成HTML的数据绑定?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！