Запуск в бесконечный цикл дайджеста при привязке к функции с $ http внутри

Question

Мне нужно создать http-ссылку для тега a. По этой причине я поставил в html линии

<a href="{{getLink(url)}}">My link</a> 

в контроллере она определяется как:

$scope.getLink = function(inputUrl){ 

    $http.get(inputUrl).success(function(data){/*.....*/}); 

} 

Почему AngularJS заканчивается в бесконечном цикле? Каков правильный дизайн?

Answer 1

Как объяснено в другом ответе, наблюдаемые выражения оцениваются на каждом дайджесте, а результирующее значение сравнивается с их предыдущим значением - грязная проверка. Если есть изменение, другая итерация дайджеста начинается, потому что изменение одного значения может вызвать изменение в другом.

Если есть круговая зависимость (в том числе, круг одного, то есть одно и то же выражение различно каждый раз), это приводит к бесконечному циклу, который Angular останавливает после 10 итераций.

В частности, ваше возвращаемое значение функции getLink является обещанием (возвращаемое значение $ http), а угловые привязки не «ждут» по обещанию.

То, что вы хотите сделать, это пнуть начало $http вызова и в обработчике присвоить возвращаемое значение свойства ViewModel, который будет связан с <a>:

function getLink(){ 
    $http.get(inputUrl) 
     .success(function(data){ 
     $scope.url = data.data; 
     }); 
} 

Вы можете позвонить getLink, например, когда ваш контроллер работает.

В окне вы просто привязать к urlng-href (не href) атрибут:

<a ng-href="url">My Link</a> 

Answer 2

После того, как вы добавите угловое выражение в виде вида {{expression}}, оно будет добавлено в список наблюдения за текущей областью.

Угловой использует механизм под названием dirty checking для архивирования двусторонней привязки. Каждый раз, когда происходят определенные события, Angular будет проходить через список наблюдений, чтобы проверить, изменилось ли наблюдаемое значение или нет, это действие называется digest loop.

Здесь some specific events состоит из пользовательского ввода, изменения модели, окончания $ http-запросов и т. Д. Поскольку вы используете функцию выражения getLink в выражении, каждый раз, когда угловой запуск грязного цикла проверки/дайджеста, эта функция будет выполняться один раз снова, чтобы проверить, изменился ли его результат возврата.

Проблема заключается в том, что функция getLink представляет собой запрос $ http после того, как он выполнен. Угловой будет запускаться еще один раунд грязной проверки, который снова выполнит эту функцию ... Удар, это бесконечный цикл.

Заключение: не добавляйте никаких $ http-вызовов в угловом выражении.