Phát hiện Tập trung vào Đầu vào Sử dụng Góc 2+

Question

Tôi đang cố gắng tạo danh sách tự động hoàn tất xuất hiện khi bạn nhập, nhưng biến mất khi bạn nhấp vào nơi khác trên tài liệu. Làm thế nào để phát hiện ra rằng một hình thức đầu vào được tập trung bằng cách sử dụng Angular 2. Angular 1 có ng-focus, nhưng tôi không nghĩ rằng Angular 2 hỗ trợ điều đó nữa.

<input id="search-box" type="search" class="form-control [(ngModel)]=query (keyup)=filter()> 
    <div id="search-autocomplete" *ngIf="filteredList.length > 0"> 
     <ul *ngFor="#item of filteredList" > 
      <li > <a (click)="select(item)">{{item}}</a> </li> 
     </ul> 
    </div> 

Nhân tiện, tôi đã sử dụng hướng dẫn này là guidance.

Answer 1

Có focus và blur sự kiện:

<input (blur)="onBlur()" (focus)="onFocus()"> 

Answer 2

Bạn có thể sử dụng các chỉ thị ngControl để theo dõi sự thay đổi trạng thái và giá trị của biểu mẫu form.

<input type="text" ngControl="name" /> 

Chỉ thị NgControl cập nhật điều khiển với ba lớp phản ánh trạng thái.

Nhà nước: Kiểm soát đã được truy cập

ng-touched 
ng-untouched 

Nhà nước: Giá trị kiểm soát đã thay đổi

ng-dirty 
ng-pristine 

Nhà nước: Giá trị kiểm soát là hợp lệ

ng- valid 
ng- invalid