TypeScript-類型“節點”上不存在屬性“ id”

Question

當我嘗試獲取元素的ID時，遇到了使用TypeScript（針對Angular2）的問題。 請參閱以下示例：

<div id="search">
    <div id="field1"></div>
    <div id="field2"></div>
</div>

如果我嘗試獲取嵌套div之一的ID，則可以正常執行此操作：

var element = document.getElementById("search");
var subelement = element.childNodes;
subelement[1].id;

然后，我將獲得“ field2”。

但是，當我嘗試使用TypeScript執行此操作時，我收到消息“ 屬性”“ id”在類型“節點”上不存在。 結果我的代碼不起作用。 我真的需要一個解決方案，因為除非有更好的方法，否則我需要了解另一個內部的嵌套元素。

Answer 1

節點不僅可以是元素，而且不一定具有id屬性。 您應該使用.children ，它僅是元素的集合。

Answer 2

錯誤TS2551：類型“節點”上不存在屬性“ setAttribute”。 您是說“屬性”嗎？

const elements = document.querySelectorAll("text");

elements[k].style.transform = '...........'; ////錯誤

elements[k]['style'].transform = '..........'; //正在工作

elements[k].parentNode.setAttribute('....'); ////錯誤

elements[k].parentNode['setAttribute']('..'); //正在工作

Answer 3

我會使用document.getElementById來引用Angular2中的DOM元素，而是像這樣利用@ViewChild ：

@Component({
  (...)
  template: `
    <div #search>
      <div id="field1"></div>
      <div id="field2"></div>
    </div>
  `
})
export class SomeComponent {
  @ViewChild('search') searchElement:ElementRef;

  ngAfterViewInit() {
    let domElement = searchElement.nativeElement;
    (...)
  }
}