DOMException:无法在'Element'上执行'setAttribute':'\ #t'不是有效的属性名称

时间:2019-08-18 02:17:57

标签: javascript angular d3.js ng-bootstrap

ng-bootstrap有一些非常直接的文档,显示了如何在元素上运行手动方法。在下面的代码块中,单击按钮会打开一个工具提示。

<button
  type="button"
  class="btn btn-outline-secondary mr-2"
  ngbTooltip="What a great tip!"
  [autoClose]="false"
  triggers="manual"
  #t="ngbTooltip"
  (click)="t.open()"
>
  Click me to open a tooltip
</button>

我想做的就是使用D3将这些属性动态添加到元素中,我可以做到,除了:

  #t="ngbTooltip"

这会引发错误:

ERROR DOMException: Failed to execute 'setAttribute' on 'Element': '\#t' is not a valid attribute name.

我真正想要执行的操作是这样的,以便可以手动调用open()方法:

this.paths = this.graph.selectAll("path").data(this.pie(data));
// update new paths
this.paths
  .enter()
  .append("path")
  .attr("class", "arc")
  .attr("stroke", "#fff")
  .attr("stroke-width", 3)
  .attr("fill", (d: any) => this.color(d.data.name))
  .attr("ngbTooltip", "Tip Me!")
  .attr("#t", "ngbTooltip") <== Here!
  .attr("onmouseover", "t.open()")
  .attr("placement", "top")
  .each(function(d: object, i: number, n: object) {
    this._current = d;
  })
  .transition(this.t)
  .attrTween("d", this.arcTweenEnter); 

0 个答案:

没有答案