Обновление представления в AngularJS с помощью $watch в сервисе

#angularjs #angularjs-scope

#angularjs #angularjs-scope

Вопрос:

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

Я разделил свою проблему на два блока, один рабочий, а другой нет.

Чтобы заставить его работать, я должен назначить свой LoginService переменной в области HeaderCtrl.

 angular.module('app', [])
.controller('HeaderCtrl', function ($scope, LoginService) {

$scope.loginService = LoginService;

$scope.$watch('loginService.isLoggedIn()', function(newVal) {
    $scope.isLoggedIn = newVal;
});
  

Вот рабочая версия
http://plnkr.co/edit/KBzE9N?p=preview

Теперь, если я удалю ссылку на LoginService в области HeaderCtrl и просто использую внедренную службу непосредственно в watch, представление перестанет обновляться. Это продемонстрировано здесь http://plnkr.co/edit/IjFS2w?p=preview

Кто-нибудь может объяснить мне, почему второй случай не работает? Я также читал, что иметь часы внутри контроллера — плохая идея, поэтому я открыт для лучших решений.

Ответ №1:

Потому что $watch отслеживает переменные области в области, из которой вы ее вызываете. В вашем втором примере $watch ищет переменную LoginService в вашей области видимости, которая, конечно, не существует.