비동기 콜백 후 Angular2 ngModel이 업데이트되지 않음

Question

왜 angle2 양방향 데이터 바인딩이이 시나리오에서 작동하지 않습니까?

<span style="color:white">{{searchLocation}}</span> 
<input name="searchLocation" type="text" placeholder="Search" [(ngModel)]="searchLocation"> 
<button class="btn btn-outline-success" type="submit" (click)="search()">Search</button> 

대상 컴포 후 HeaderComponent

export class HeaderComponent implements OnInit { 

    searchLocation: string; 
    @Output() locationFound: EventEmitter<Position> = new EventEmitter<Position>(); 

    constructor(private _locationService: LocationService) { } 

    ngOnInit() { 
    this.searchLocation =""; 
    } 

    search():void{ 

    this._locationService.geocodeAddress(this.searchLocation) 
     .subscribe((position:Position)=>{ 
      this.searchLocation ="new value"; 
      this.locationFound.emit(position); 
    }); 
    } 
} 

인 상기 searchLocation 변경 등록을 차단하지만 표시를 갱신하지 않는다.

나는 누군가가 나를

Answer 1

 this.searchLocation =""; 

searchLocation가 null로 할당 도움이 될 수 있기를 바랍니다. null가있는 경우, DOM는 갱신되지 않습니다. 유효한 문자열을 입력 해보십시오.