angular - angular 6 d3 可折叠树仅在数据更改时更新文本

Question

这是我正在使用的代码，当前加载树形图，但我想要的是当数据更改时，树形图必须使用 ngonchange 方法重新呈现数据。

ngOnInit() {


        // Assigns parent, children, height, depth
        this.root = d3.hierarchy(this.treeData[0], function (d: any) {
          return d.children;
        });
        this.root.x0 = this.height / 2;
        this.root.y0 = 0;

        //this.root.children.forEach(this.collapse);
        this.root.children.forEach(() => {
          this.collapse;
        });
        this.updateChart(this.root);
      }

updateChart(source) {

    // Collapse after the second level

    // Assigns the x and y position for the nodes
    this.treeDataFor = this.treemap(this.root);

    // Compute the new tree layout.
    var nodes = this.treeDataFor.descendants(),
      links = this.treeDataFor.descendants().slice(1);  

    this.nodeEnter.append('text')
      .attr('x', (d: any) => d.children || d._children ? 13 : 13)
      .attr('y', (d: any) => d.children || d._children ? 30 : 30)
      .attr('class', 'treeVal')
      .attr('dy', (d: any) => d.children || d._children ? '6em' : '3em')
      .attr('dx', (d: any) => d.children || d._children ? '4em' : '6.8em')
      .attr('text-anchor', (d: any) => d.children || d._children ? 'inherit' : 'end')
      .attr('font-size', (d: any) => d.children || d._children ? '22px' : '14px')
      .attr('font-weight', (d: any) => d.children || d._children ? 'bolder' : 'bolder')
      .text((d: any) => d.children || d._children ? d.data.value + ' ' + 'KW' : d.data.value + ' ' + 'KW');      
  }

我如何在这种情况下使用 ngOnChanges 并在每次数据更改时更新树形图？我想在数据更改时更新文本节点。有人可以帮忙吗。提前致谢

标签： angulard3.js