выражение «Angular2 (beta3)» изменилось после его проверки »в значениях формы обновления

Question

Это своего рода продолжение моего предыдущего сообщения о вложенных формах в Angular2 (бета 3 с TS) (Angular2 beta: nesting form-based parent/child components and validating from parent), но я отправляю новый вопрос, поскольку он относится к другому типу проблемы.

Вы можете найти репродукцию проблемы, описанной здесь, в http://plnkr.co/edit/iCmmy9at2wF5qY0P6VmV. Короче говоря, в этом поддельном сценарии у меня есть компонент, представляющий одно слово из воображаемого словаря, а другой дочерний компонент, используемый для представления каждого смысла для этого слова; Таким образом, между родительским компонентом и его дочерними элементами существует соотношение 1-ко-многим. Оба имеют шаблон на основе формы, построенный с помощью построителя форм. Детский шаблон находится внутри NgFor, где я привязываю каждый смысл от родительской (= слова) модели. Таким образом, все свойства чувства каждого слова автоматически привязаны к модели слова.

Некоторые из этих свойств имеют несколько валидаторов, прикрепленных (как стандартных, так и стандартных). Моя проблема заключается в том, что когда я программно устанавливаю модель слова из родительского компонента (что также подразумевает установку значения элементов формы), это, похоже, вызывает некоторые условия гонки в процессе валидации, что вызывает несколько исключений типа ИСКЛЮЧЕНИЕ: выражение '! definitionCtl.valid' изменилось после его проверки. Предыдущее значение: «true». Текущее значение: «false», которые блокируют дальнейшее выполнение кода.

AFAIK, единственная информация, которая кажется связанным с этим вопросом здесь:

• https://github.com/angular/angular/issues/5992,
• Angular2: Nested *ngFor resulting in 'Expression has changed after it was checked'

Однако решение для моего вопроса, кажется, не быть под рукой от эти обсуждения, если (если я хорошо понимаю), я выбираю вручную управлять всеми моими привязками, чего я бы хотел избежать, так как в реальном приложении их будет много. Может ли кто-нибудь помочь?

Answer 1

Вы могли бы попытаться отключить режим разработчика Angular2:

import {bootstrap} from 'angular2/platform/browser'; 
import {App} from './app'; 
import {enableProdMode} from 'angular2/core'; 

enableProdMode(); 

bootstrap(App, []) 
    .catch(err => console.error(err)); 

Посмотреть ответ Гюнтера для получения более подробной информации:

• In Angular2, why are there 2 times check for content and view after setTimeout?

Answer 2

Я имел эту проблему. Об этом было много в https://github.com/angular/angular/issues/6005. У нас была другая ситуация и решение (я только что перечислил ее на этой странице).

• Наше Угловая приложение - https://github.com/GeoscienceAustralia/GNSS-Site-Manager, имеет модели реактивные формы, которые вложены и построены на нескольких компонентов в ngOnInit(). Некоторые из этих форм свернуты с ngIf в шаблоне
• данные считываются в также в ngOnInit() и применяется с theModelForm.patchValue(data)
• Эта ошибка была наплавке, когда одна из форм разрушились была расширена. Это связано с тем, что DOM не был построен, потому что форма была создана в ngOnInit(), которая не срабатывала, пока она не была расширена.Вынуть patchValue() и проблема ушла
• Мы придумали два решения
  1. Перед тем patchValue() запустить this._changeDetectionRef.detectChanges();. И измените ngIf на [hidden] так, чтобы форма и DOM были полностью построены. Нижняя сторона этого времени - это стоимость времени и памяти, так как полная форма и связанная с ней DOM создаются (это может быть не проблема во многих приложениях, но это было для нас, поскольку у нас есть гигантская форма).
  2. Лучшим решением является применение patchValue() (или setValue(), если данные и поля 1: 1) в компонентах и, таким образом, происходит только в том случае, если форма создана в ngOnInit().

я не совершал эти изменения еще (22/3/17).