PrimeNG p-calendar - ExpressionChangedAfterItHasBeenCheckedError - 如何处理

Question

我的PrimeNG p-calendar 组件有问题（Angular版本：“~4.0.0”）：我在这样的p对话框中使用它：

<p-dialog header="User Details" [(visible)]="displayDialog" [responsive]="true" showEffect="fade" [modal]="true">
    <p-calendar [(ngModel)]="dateOfBirth" [showIcon]="true"></p-calendar><span>{{dateOfBirth|date}}</span>
</p-dialog>

当用户 选择日历中的值 时，会在控制台日志中抛出错误：

ERROR Error: ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: ''. Current value: '10'.
    at viewDebugError (:37885/libs/@angular/core/bundles/core.umd.js:8668) [angular]

但是，当我使用' 内嵌 '选项时，效果很好：

<p-dialog header="User Details" [(visible)]="displayDialog" [responsive]="true" showEffect="fade" [modal]="true">
    <p-calendar [(ngModel)]="dateOfBirth" [inline]="true"></p-calendar><span>{{dateOfBirth|date}}</span>
</p-dialog>

以下是组件的代码（略微修剪）：

import { Component } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';


@Component({
    moduleId: module.id,    
    selector: 'user-details',
    templateUrl: './user-details.html'  
})

export class UserDetailComponent {     
    dateOfBirth: Date;

    constructor(
       private route: ActivatedRoute,
       private router: Router
    ) {}

    onDateSelect(value: Date) {
        console.log("onDateSelect");
    }

    onBlur(value: Date) {
        console.log("onBlur");
    }
}

有没有人对如何处理这个问题有任何想法？无论如何，谢谢你的尝试，谢谢！

我创建了一个plunker p-calendar issue项目来证明这个问题。