2016-05-25 7 views
1

パイプされたオブジェクトを再作成する以外は、最後に「パイプされた」値は更新されません。 この方法でタイマーを作成しているので、これは私の予想される動作ではありません。パイプされた値が更新されない

@Pipe({ 
    name: 'fromNow' 
}) 
export class FromNowPipe { 
    transform(value: any, args: Array<any>): string { 
    return moment(value).fromNow(); 
    } 
} 

@Component({ 
    selector: 'event-spinner', 
    changeDetection: ChangeDetectionStrategy.Default, // all other modes does not work at all 
    pipes: [FromNowPipe], 
    template: ` 
<div class="col-xs-5"> 
    NOT updating: {{ last | fromNow }} <br/> 
    Updating: {{ lastText }} <br/> 
</div> 
    ` 
}) 
export class EventSpinner implements OnInit { 
    last: moment.Moment; 
    lastText: string; 

    ngOnInit(): void { 
     this.last = moment(); 
     let obs = Observable.interval(1000).subscribe(() => { 
      // this.last = moment(this.last); // uncommenting this line it updates 
      this.lastText = this.last.fromNow(); 
      this.cdRef.detectChanges(); // commenting this line breaks everything 

     }); 
    } 

} 

私はこの問題をきれいに解決するために何ができますか? つまり、lastTextなどの余分なオブジェクトを追加したり、モーメントオブジェクトを毎回自分自身からコピーすることを避けてください。

ありがとうございます!

答えて

1

私はあなたがゾーン内で物事を実行する必要があるので、モーメントがAngular2の範囲外intantiatedされているので、それはだと思う:

constructor(private ngZone:NgZone) { // <----- 
} 

ngOnInit(): void { 
this.ngZone.run(() => { // <----- 
    this.last = moment(); 
    let obs = Observable.interval(1000).subscribe(() => { 
     // this.last = moment(this.last); // uncommenting this line it updates 
     this.lastText = this.last.fromNow(); 
     this.cdRef.detectChanges(); // commenting this line breaks everything 

    }); 
    }); 
} 

編集

実際には、fromNow方法は、コンテンツを更新しますthis.lastプロパティの参照ではありません。 Angular2は参照の変更に基づいて変化を検出します。あなたは実際にhe opens DHC for the first timeと何をしていますか?

関連する問題