ionicv2 프레임 워크에서 UI가 업데이트되지 않습니다.

Question

<ion-item> 
    <div> 
     <ion-calendar (change)="onPeriodChange($event)"></ion-calendar> 
    </div> 
</ion-item> 

<ion-list> 
    <ion-item> 
     <ion-label>{{'tasks>task-create>time'|translate}}<ion-badge>{{time.lower}} - {{time.upper}}</ion-badge></ion-label> 
     <ion-range min="0" max="23" dualKnobs="true" [(ngModel)]="time" color="secondary"> 
      <ion-label range-left>{{'tasks>task-create>zero'|translate}}</ion-label> 
      <ion-label range-right>{{'tasks>task-create>twothree'|translate}}</ion-label> 
     </ion-range> 
    </ion-item> 
</ion-list> 

ionic2 앱에는 두 가지 컨트롤이 있습니다. 캘린더의 날짜를 클릭하거나 이온 - 범위 컨트롤을 슬라이드합니다. 그것은 캘린더와 범위 컨트롤을 업데이트하는 것을 보여주지 않습니다. 그러나 드롭 다운 (ion-select)을 열면 Calendar는 선택한 날짜를 강조 표시하고 슬라이더는 내가 선택한 곳으로 이동합니다.

Answer 1

은 당신이합니다 (.TS 파일의 모든)을 시도 할 수있는 옵션 몇 가지가 있습니다

1. 사용 옵션 # 1 NgZone.run()
2. 사용 ApplicationRef.tick()

, 당신은 주입 할 필요가 (import을 통해) 코드에 NgZone을 입력하고 run() 코드를 사용하여 UI를 제어하십시오. 예를 들면 : 당신이 업데이트보기를 강제 할 때마다 옵션 # 2에 관해서는

import {Component, NgZone} from '@angular/core'; 
[...] 
ngZone.run(()=>{ 
    console.log("It's running!"); 
}); 

, 당신은 전화 후 tick() 방법을 ApplicationRef을 가져해야합니다. 예를 들어 :

는

import {Component, ApplicationRef} from '@angular/core'; 
[...] 
console.log("It's running!"); 
applicationRef.tick(); 

또한 applicationRef.tick()에 유사한 방법으로 그 detectChanges() 방법을 @angular/core에서 ChangeDetectionRef를 가져 오기 및 호출 (내가 익숙하지 오전) 세 번째 옵션을,있다.

이들은 모두 각도 2 방법이며, 따라서 Angular 2's docs 아래에 문서화되어 있습니다.