Сфокусировать ввод внутри пользовательского Angular MatFormFieldControl

Question

Как сделать так, чтобы мой родительский компонент фокусировался на поле ввода asset1 внутри моего пользовательского MatFormFieldControl при загрузке страницы *?

Родительский компонент HTML:

    <mat-form-field class="symbol">
      <symbol-input
        name="symbol"
        placeholder="Symbol"
        ngModel
        #symbolInput="ngModel"
        [(ngModel)]="symbol"></symbol-input>
    </mat-form-field>

Пользовательский MatFormFieldControl HTML:

<div [formGroup]="parts">
  <input class="asset1" formControlName="asset1" size="12">
  <span class="input-spacer">&frasl;</span>
  <input class="asset2" formControlName="asset2" size="12">
</div>

* Я предполагаю, что я реализую AfterViewInit в родительском компоненте и, надеюсь, вызову событие focus, которое будет просачиваться вниз?

Answer 1

@ IvanS95 указал мне правильное направление.

Добавлен ViewChild в родительский компонент:

@ViewChild(SymbolInputComponent) set focus(sic: SymbolInputComponent) {
    sic.autofocus = true;
};

Затем я добавил в свою пользовательскую MatFormFieldControl публичную переменную autofocus, установленную в false. В случае, если мне нужно использовать это поле несколько раз на данной странице.

Затем я добавил autofocus в свой шаблон MatFormFieldControl:

<div [formGroup]="parts">
  <input class="asset1" formControlName="asset1" size="12" [autofocus]="autofocus">
  <span class="input-spacer">&frasl;</span>
  <input class="asset2" formControlName="asset2" size="12">
</div>