Javascript document.querySelector以角度显示

我有一个列表，其中每个

li

都有唯一的

数据id

<ul class="list">
  <li class="list__el"
      *ngFor="let item of cars"
      data-id="{{ item.id }}">
  </li>
</ul>

如何正确地为Angular重写它？

使用和，例如

#listItem

@组件({
模板：`



`
})
导出组件MyComponent实现AfterViewInit{
//请注意，此处的参数与模板中的#listItem相关。
@ViewChildren（'listItem'）
公共列表项！：QueryList
公共ngAfterViewInit（）{
console.log(
this.listItems.find（itm=>
itm.nativeElement.getAttribute（'data-id'）=='my element id'
)
)
}
}

使用和一个如

#listItem

@组件({
模板：`



`
})
导出组件MyComponent实现AfterViewInit{
//请注意，此处的参数与模板中的#listItem相关。
@ViewChildren（'listItem'）
公共列表项！：QueryList
公共ngAfterViewInit（）{
console.log(
this.listItems.find（itm=>
itm.nativeElement.getAttribute（'data-id'）=='my element id'
)
)
}
}

let myLi = document.querySelector(`.list__el[data-id="${item.id}"]`)