FormBuilder Kontrolle verursacht "Ausdruck hat sich verändert, nachdem es überprüft wurde" Ausnahme

Ich habe ein Formular instanziiert wird programmgesteuert über DynamicComponentLoader::loadIntoLocation. Der Formular-code ist unten:

constructor (
    private _builder: FormBuilder
) {
    this.editForm = _builder.group({
        name: ['', Validators.required],
        email: ['', Validators.compose([Validators.required, Helpers.emailValidator])],
        phone: [''],
        phoneAlt: [''],
        location: [''],
        dob: [''],
        bio: [''],
    });
}

Werden Sie feststellen, dass einige Formulare nicht haben, Prüfungen (soweit ich das beurteilen kann, das ist das gleiche wie mit Validators.nullValidator habe ich getestet mit beiden).

In meinem template ich habe folgenden code (für jede control):

<label for="phone">Contact Number <span *ngIf="!phone.valid">- {{e(phone)}}</span></label>
<input type="text" name="phone" id="phone" ngControl="phone" #phone="ngForm">

Die erste Kontrolle, die nicht mit einem validator wirft die folgende Ausnahme zweimal, wenn es Sie trifft die !phone.valid Teil der Vorlage:

EXCEPTION: Expression '!phone.valid in e@15:43' has changed after it was checked. Previous value: 'true'. Current value: 'false' in [!phone.valid in e@15:43]

Zu keinem Zeitpunkt bin ich dem berühren der Bedienelemente sowie this.editForm nach der ersten Schöpfung, so, soweit mein code betroffen ist, sollte nichts ändern.

Ich bin mir bewusst, dass ich unterdrücken kann, die Fehler durch den Aufruf enableProdMode() aber ich würde lieber das problem lösen als es auszublenden.

Bearbeiten (8. Feb): ich habe da versucht, verschieben Sie den Inhalt des modal auf eine separate Seite, aber der Fehler weiterhin Auftritt. Dies würde vorschlagen, die Frage bezieht sich nicht auf die Art, wie ich bin, das erstellen und laden der modals, sondern die ControlGroup oder FormBuilder.

Plunker des Problems | Plunker ohne modal

InformationsquelleAutor Tam | 2016-01-26