2017-03-07 13 views
1

タイムスタンプを読み取り可能な式に変換するためにコンポーネント内でDatePipeを使用しています。文書がロードされると、しかし、私は例外を取得:角2 - 日付パイプ例外:チェックされた後に式が変更されました

EXCEPTION:によって引き起こさhttp://localhost:3000/app/interest/user-interest.component.html:15:15でエラーが発生しました:それは確認した後、式が変更されました。前の値: '6бер。 2017 '。現在の値: '5бер。 2017 '。

誰でも、ここで何が起こっているか教えてください。ここでは基本的なコードです:

ユーザーinterest.component.html

<p md-line>{{getFolderLastLearningSessionDate(folder.learningSessions)}}</p> 

ユーザーinterest.component.ts

getFolderLastLearningSessionDate(sessions:Array<LearningSession>):string { 
    if (sessions) 
     try { 
     return this.learningSessionService.getLearningSessionDate(this.learningSessionService.getLastLearningSession(sessions)); 
     } catch (ex) { 
     console.log(ex); 
     } 
    else return "Folder have not bean studied yet"; 
    } 

学習sessions.service.ts

public getLearningSessionDate(session:LearningSession):string { 
    let datePipe = new DatePipe("uk-UA"); 
    return datePipe.transform(session.sessionDate); 
    } 
public getLastLearningSession(sessions:Array<LearningSession>):LearningSession { 
    if (sessions) { 
     return sessions.sort(
     (session1:LearningSession, session2:LearningSession) => { 
      return session2.sessionDate.getDate() - session1.sessionDate.getDate(); 
     }).shift(); 
    } 
    else 
     throw new Error("folder is not studied yet"); 
    } 

答えて

3

変更検出によってモデルが変更された場合、このエラーがスローされます。

devMode Angularでは、最初の回転後に追加の変更検出が行われ、1回目と2回目の間にモデルが変更されたかどうかが確認されます。そうした場合は、あなたが言及したエラーメッセージが表示されます。後続の呼び出しはで異なる値(異なるオブジェクトインスタンスを返すことができる場合は特に、これは、おそらく後続の呼び出しメソッドへの結合

{{getFolderLastLearningSessionDate(folder.learningSessions)}} 

に異なる値を返すメソッドに結合することによって引き起こされるあなたのケースで

は、問題があります同じプロパティと同じプロパティ値は異なるとみなされます)。

したがって、イベントハンドラを登録し、そのようなイベントハンドラでクラスフィールドを更新し、代わりにクラスフィールドにバインドする方が良いです。

関連する問題