Javascript 处理ViewChildren的最佳角度7钩是什么

我有一个Angular 7应用程序，其中我正在尝试处理ngAfterViewChecked（）中的文本输入

文本输入是mat树中的一个节点。它的可见性取决于ngIf条件。如果不满足该条件，则显示范围。本质上，如果用户双击树中的节点（span元素），它将成为文本输入，以便用户可以编辑文本：

<mat-tree [dataSource]="nestedDataSource" [treeControl]="nestedTreeControl">
  <mat-tree-node *matTreeNodeDef="let node">
    <li>
      <span *ngIf="!node.isInput" (dblClick)="nodeDoubleClicked(node)">{{ node.name }}</span>
      <input *ngIf="node.isInput" #nodeNameInput type="text" [(ngModel)]="node.name" (blur)="doneEditting(node)" (keypress)="keyPressed($event, node)" />
    </li>
  </mat-tree-node>
  <mat-nested-tree-node *matTreeNodeDef="let node; when: hasNestedChild">
    <button mat-icon-button matTreeNodeToggle>
      <mat-icon>
        {{ nestedTreeControl.isExpanded(node) ? 'expand_more' : 'chevron_right' }}
      </mat-icon>
    </button>
    <span *ngIf="!node.isInput" (dblClick)="nodeDoubleClicked(node)">{{ node.name }}</span>
    <input *ngIf="node.isInput" #nodeNameInput type="text" [(ngModel)]="node.name" (blur)="doneEditting(node)" (keypress)="keyPressed($event, node)" />
    <ul [class.collapsed]="!nestedTreeControl.isExpanded(node)">
      <ng-container matTreeNodeOutlet></ng-container>
    </ul>
  </mat-nested-tree-node>
</mat-tree>

…其中击键在按键处理程序中设置，在模糊处理程序中设置为false

但我想知道是否有另一个钩子可以可靠地用来集中输入并选择文本，同时不响应按键。我选择ngAfterViewChecked是因为测试表明它是唯一一个每次都一致准备好nodeNameInputs的钩子（即this.nodeNameInputs.length始终为1）。但也许我错过了某些钩子

---

我的变通方法看起来像是一个黑客。您将如何解决这个问题？

创建一个焦点指令，并将其放在您想要聚焦的输入上，您不必担心生命周期事件

import { Directive, ElementRef } from '@angular/core';

@Directive({
  selector: '[focus]'
})
export class FocusDirective {

  constructor(elm: ElementRef) {
    elm.nativeElement.focus();
  }
}

并使用它

<input focus>

---

只需将boolen变量添加到子组件中即可。从正确的状态开始。将可见性绑定到该变量，并让模式根据元素或数据事件控制它。例如，订阅数据完成将允许视图变量为true，从而更改视图。让模型控制一切。它更好Hanks Adrian我不熟悉指令的工作原理。这给了我一个线索。我将对此进行调查，看看它是否符合我的目的。

import { Directive, ElementRef } from '@angular/core';

@Directive({
  selector: '[focus]'
})
export class FocusDirective {

  constructor(elm: ElementRef) {
    elm.nativeElement.focus();
  }
}

<input focus>