Как AngularJS узнает, когда переменные меняются? Как работает грязная проверка AngularJS?

Я читал статью, чтобы немного больше понять, как работает AngularJS.

Одним из терминов, которые я не понял, является " Dirty Checking.

Что именно? Похоже на паттерн Observer, но, видимо, он лучше.

Можете ли вы помочь мне понять это, пожалуйста?

РЕДАКТИРОВАТЬ: это может быть также полезно для людей, которые хотят узнать больше об этом, чтобы посмотреть это видео от swiip в NgEurope несколько лет назад.

Ответ 1

По этой ссылке:

Angular определяет концепцию так называемого цикла дайджеста. Этот цикл можно рассматривать как цикл, во время которого Angular проверяет, есть ли какие-либо изменения во всех переменных, наблюдаемых всеми $ scopes. Так что, если в вашем контроллере определен $ scope.myVar, и эта переменная была помечена для наблюдения, то вы явно указываете Angular отслеживать изменения в myVar на каждой итерации цикла.

Этот " digest " также называется "грязной проверкой", потому что, в некотором смысле, он сканирует область для изменений. Я не могу сказать, к лучшему или к худшему, чем наблюдаемый паттерн. Это зависит от ваших потребностей.

Некоторые ссылки:

Ответ 2

Угловая грязная проверка рабочего процесса механизма.

enter image description here

Грязная проверка - это простой процесс, который сводится к очень простой концепции: он проверяет, изменилось ли значение, которое еще не было синхронизировано в приложении.

Наше приложение Angular отслеживает значения текущих часов. Angular идет вниз по списку $ watch и, если обновленное значение не изменилось со старого значения, продолжает работу по списку. Если значение изменилось, приложение записывает новое значение и продолжает поиск в списке $ watch.

Проверьте всю статью здесь

Ответ 3

Что такое грязная проверка?

Процесс проверки всех часов для обнаружения изменений называется грязной проверкой. Возможны два сценария

Сначала -

  • Получить список из списка
  • Проверьте, был ли элемент изменен.
  • Если в элементе нет изменений, то
  • Нет действий, переход к следующему элементу в списке наблюдения

Второй -

  • Получить список из списка
  • Проверьте, был ли элемент изменен.
  • Если есть изменение в элементе
  • DOM необходимо обновить, вернуться в цикл digest

Во втором случае цикл продолжается до тех пор, пока не найдет никаких изменений во всем цикле. И как только он завершится, DOM будет обновляться, если потребуется.

Ответ 4

Просто изменив предыдущий ответ...

Angular имеет концепцию 'цикла дайджест. Вы можете рассматривать его как цикл. В котором Angular проверяет, есть ли какие-либо изменения ко всем переменным, наблюдаемым всеми $scopes (внутренние функции $watch() и $apply() становятся связанными с каждой переменной, определенной в $scope).

Итак, если у вас есть $scope.myVar, определенный в вашем контроллере (это означает, что эта переменная myVar была отмечена для просмотра), вы явно сообщаете Angular для отслеживания изменений на myVar на каждой итерации цикла. Поэтому, когда значение myVar изменяется, каждый раз, когда $watch() замечает и выполняет $apply(), чтобы применить изменения в DOM.

Этот " Дайджест" также называется " грязной проверкой", потому что он каким-то образом просматривает область изменений. Поскольку все наблюдаемые переменные находятся в одном цикле (цикл дайджеста), любое изменение значения любой переменной заставляет переназначать значения других наблюдаемых переменных в DOM.

PROS: Это способ Angular выполняет двустороннюю привязку данных.

CONS: Если на одной странице больше наблюдаемых переменных ( > 2000-3000), вы можете увидеть отставание во время загрузки страницы. (Но я говорю, если есть много наблюдаемых переменных в одна страница, это плохой дизайн страницы: p).

Существуют и другие минусы, а также обходные пути: D

Ответ 5

Я прочитал замечательную статью о грязной проверке в этом сообщении в блоге. Был также этот ответ SO

TL;DR; версия

Когда цикл $digest запускается, наблюдатели будут проверять любые изменения в модели области видимости и, если они есть (изменение может также произойти из-вне Angular -domain), соответствующие функции прослушивателя казнены. Это снова запустит цикл $digest и проверит, была ли изменена модель области (функция прослушивателя также может изменить модель области).

В целом цикл $digest будет работать дважды, даже если слушатель не изменит модель или пока не достигнет максимального количества циклов в 10.

Ответ 6

Грязная проверка проверит все изменения в переменной $scope и обновит ее до DOM. Это делается с помощью angular js, вы также можете выполнить грязную проверку самостоятельно.