0

我需要在动态创建输入字段的页面上修改 DOM。

我使用 @viewChildren 将这些 elementRefs 拉入一个数组。我一直在阅读使用 elementRefs 是一个坏主意。我不使用它们来修改 DOM,但我确实使用它们来允许 renderer2 修改 DOM。

IE

@ViewChildren('score') scores: QueryList<ElementRef>;

score 是分配给@viewChildren 的变量。

let nextField: ElementRef;
    if (i < this.scores.length) {
      nextField = this.scores.get(i);
      this.renderer.selectRootElement(nextField.nativeElement).focus();
      this.renderer.selectRootElement(nextField.nativeElement).select();
    }

这段代码有问题吗?

我想知道其他一些示例是否会导致可移植性或服务器端渲染问题.....

1)

 const currentField = new ElementRef(event.target);
    const index = this.scores.toArray().findIndex(el => el.nativeElement.name === currentField.nativeElement.name);
let fieldValue = this.scores.get(index).nativeElement.value

(再次分数是我分配给@viewChildren的变量)

3)

const currentValue = this.renderer.selectRootElement(currentField.nativeElement).value

currentField 只是一个 ElementRef。

4)。使用 Renderer2,所有这些方法都可以接受设置值的方法吗?

this.renderer.selectRootElement(currentField.nativeElement).value = 'x';
this.renderer.setValue(currentField.nativeElement, 'x');
this.renderer.setProperty(currentField.nativeElement, 'value', 'x');
4

0 回答 0