angular

ダイアログ表示時に初期フォーカスを当てようとしてハマった（未解決）

いろいろ方法はある

１．ElementRefを使う方法
　　https://davidmcintosh.medium.com/auto-focusing-an-angular-input-the-easy-way-part-1-dcb1799e025f

２．document.querySelectorでも同じらしい。
　　https://angular.jp/guide/accessibility

３．ディレクティブを作るのも一般的らしい。
　　https://traveler0401.com/angular-autofocus/

３のディレクティブは試してないが、１，２はうまくいかなかった。
初期フォーカスはあたっているのだが、また先頭の要素にフォーカスが戻ってしまうみたい。
ngAfterViewInitから実行してるのに、ダメ。
ngAfterContentInit, ngAfterContentCheckedもダメ。

setTimeoutで遅れて実行すればうまくいくのだが・・・。

   const self = this;
   setTimeout(function() {
     self.myInputField.nativeElement.focus();
   }, 500);

↓それはいまいちだよね、っていう意見。ごもっとも。
https://stackoverflow.com/questions/50006888/set-focus-on-input-element

しょうがないので、とりあえず
tabindex="-1"
で回避。
先頭の×ボタン（ダイアログクローズ）にカーソルを当てたくないだけなので、とりあえずこれでいいか。。。