Angular 2で新たに追加された入力にどのように焦点を当てますか？

Question

マイテンプレート

@ViewChildren('search') searchInput: QueryList<any>; 
 

 
    toggleSearch(){ 
 
     this.showSearch = !this.showSearch; 
 
     if (this.showSearch){ 
 
      console.log(this.searchInput.first); <= undefined 
 
     } 
 
    }

\t \t \t <li class="search" *ngIf="showSearch" > 
 
\t \t \t \t <i class="news-admin-icon news-admin-search"></i> 
 
\t \t \t \t <input (blur)="toggleSearch()" #search (keyup)="searchNews(search.value)" type="text" placeholder="Search"> 
 
\t \t \t </li> 
 
\t \t \t </li> 
 
\t \t \t <li class="special" *ngIf="!showSearch" (click)="toggleSearch(search)"> 
 
\t \t \t \t <a href="#"><i class="news-admin-icon news-admin-search"></i> Search</a> 
 
\t \t \t </li>

I私が取得しようとすると、 @ViewChildrenで '検索' @ViewChildで '検索' が、未定義ゲットしてください私が手

QueryList_dirty：false_emitter： EventEmitter_results：Array [1]変更：（...）ダーティ：（...）first：（...）last：（...）length :(...）proto：オブジェクト

Answer 1

これを追加してみてください：

ngAfterViewChecked() { // Called after child views changed 
    if(this.showSearch && this.searchInput.first) { // check is showSearch and ViewChildren has result 
    this.searchInput.first.nativeElement.focus(); // set focus on native input element 
    } 
}