Question

我在组件中使用DatePipe将时间戳转换为可读表达式。但是一旦文档被加载，我得到例外：

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");
  }

Answer 1

当更改检测导致模型发生更改时，将引发此错误。

在devMode Angular中，在第一个之后进行额外的变化检测，并检查模型是否在第一个和第二个回合之间发生变化。如果是，那么您会收到您提到的错误消息。

在您的情况下，这可能是由于绑定到在后续调用中返回不同值的方法引起的

{{getFolderLastLearningSessionDate(folder.learningSessions)}}

绑定到方法是有问题的，特别是如果后续调用可以返回不同的值（具有相同属性和相同属性值的不同对象实例被认为是不同的）。

因此，最好在这样的事件处理程序中注册一些事件处理程序并更新一个类字段，然后绑定到类字段。

Angular 2 - 日期管道异常：表达式在检查后发生了变化

1 个答案: