Question

我动态创建了HTML canvas元素，同时将元素大小的数量更改为更多，它使用先前创建的元素而不是创建所有新对象，因此也未清除绑定。

这是我的代码

<ng-container *ngFor="let i of rows; let i=index">
    <ng-container *ngFor="let j of cols; let j=index">
      <div id="Div{{(i * cols.length) + j}}">
        <canvas id="Canv{{(i * cols.length) + j}}" style="position: absolute"></canvas>
      </div>
    </ng-container>
  </ng-container>

谢谢。

Answer 1

如果您不是每次都创建一个新元素，您会发现所有修改都是针对相同的引用进行的，如下所示：

let div = document.createElement('div');

function addElement(w: number, h: number) {
    div.style.backgroundColor = 'aqua';
    div.style.width = w + 'px';
    div.style.height = h + 'px';

    document.body.appendChild(div);
}

addElement(100, 100);

addElement(20, 20);

这是一个工作版本，每次都会创建一个新元素...

function addElement(w: number, h: number) {
    const div = document.createElement('div');
    div.style.backgroundColor = 'aqua';
    div.style.width = w + 'px';
    div.style.height = h + 'px';

    document.body.appendChild(div);
}

addElement(100, 100);

addElement(20, 20);

动态HTML元素创建

1 个答案: