我可以在不使用模板中的`#`的情况下访问原生DOM元素

Question

我可以使用@ViewChildren装饰器访问组件视图中的组件，如下所示：

@Component({
  selector: 'my-app',
  template: `
    <alert type="info"></alert>
  `,
})
export class App {
  @ViewChildren(AlertComponent) alerts: QueryList<AlertComponent>

有没有办法使用@ViewChildren装饰器访问DOM元素，然后在模板中使用#符号？也许某种read参数味道？

  selector: 'my-app',
  template: `
    <div #divElement>Tada!</div>
  `,
})

@ViewChild("divElement") div: any;

如果不可能，请在评论或答案中提及。只想知道。

Answer 1

ViewChild装饰器仅适用于IQueryable或ComponentRef - 变量。第二个参数对已经查询过的元素起作用。这里给出了一个很好的答案：

https://stackoverflow.com/a/35209681/324224

如何实现ViewChild可以在Angular repo中看到：

https://github.com/vicb/angular/blob/master/modules/@angular/core/src/metadata/di.ts#L353

基于文档和测试：

https://github.com/angular/angular/blob/14ee75924b6ae770115f7f260d720efa8bfb576a/modules/%40angular/core/test/metadata/di_spec.ts

我很确定只支持两种选择器类型 - ref和ComponentRef - 变量。