Javascript $scope.$手表工作不正常

我有一个登录表单，它需要一组错误。问题是，此登录表单通过自定义指令从左侧滑入。当我想滑出它的视线，我需要当前的错误消失。我设置了一个

$watch

函数来监视

sharedInfo.getError（）

服务函数中的更改，但它仅在控制器加载后停止侦听更改时运行。我似乎无法让它工作，我以前像这样使用过，没有任何困难。我需要一些帮助来查找故障

控制员：

forumApp.controller('signinCtrl', ['$scope', 'fbRef', 'validation', 'userLogic', 'sharedInfo', function($scope, fbRef, validation, userLogic, sharedInfo) {

    $scope.$watch('sharedInfo.getError()', function(newValue, oldValue) {
        console.log(oldValue);
        console.log(newValue);
        $scope.error = newValue;
    });

    $scope.user = {
        email: '',
        password: ''
    }

    $scope.validate = function() {

        $scope.error = validation.validateSignin($scope.user, $scope.error);

        if ($scope.error) {
            return false;
        }
        else {
            userLogic.signinUser($scope.user).then(function(authData) {
                sharedInfo.setAuthState(authData);
            }).catch(function(error) {

                switch (error.code) {

                    case 'INVALID_USER': 
                        $scope.error = 'Invalid email';
                        sharedInfo.setError($scope.error);
                        break;

                    case 'INVALID_EMAIL': 
                        $scope.error = 'Invalid email format';
                        sharedInfo.setError($scope.error);
                        break;    

                    case 'INVALID_PASSWORD': 
                        $scope.error = 'Invalid password';
                        sharedInfo.setError($scope.error);
                        break;
                }
            });
        }
    }
}]);

跟踪控制器之间任何共享信息的服务：

forumApp.service('sharedInfo', [function() {

    var authState;
    var error;

    return {
        getAuthState: function() {
            return authState;
        },
        setAuthState: function(authData) {
            authState = authData;
        },
        getError: function() {
            return error;
        },
        setError: function(newError) {
            error = newError;
        }
    }
}]);

执行幻灯片的指令：

forumApp.directive('mySigninSlide', ['sharedInfo', function(sharedInfo) {
    return {
        restrict: 'A',
        link: function($scope, element, attrs) {

            element.on('click', function() {

                var sidebar = $('#signin-wrapper');

                if ($scope.isAnimated === undefined || 
                    $scope.isAnimated === false) {

                    sidebar.stop().animate({left: '340px'});
                    $scope.isAnimated = true;
                }
                else {
                    sidebar.stop().animate({left: '-606px'});
                    $scope.isAnimated = false;
                    sharedInfo.setError('');
                }
            });
        }
    };
}]);

---

您必须返回您正在观看的内容的值才能有效地观看它

$scope.$watch(sharedInfo.getError(), function(newValue, oldValue) {
        console.log(oldValue);
        console.log(newValue);
        $scope.error = newValue;
    });

或

---

另一种选择是将

sharedInfo

放入范围

$scope.sharedInfo = sharedInfo;
$scope.$watch('sharedInfo.getError()', function(newValue, oldValue) {
  ...
});

---

$scope.$watch

监视

$scope

上的值

sharedInfo

在

$scope

中不存在。这就是你的问题。监视正在尝试查找

$scope.sharedInfo.getError（）

。您要查找的代码是

$scope.$watch（函数（）{return sharedInfo.getError（）；}，函数（newValue）{$scope.error=newValue；}），但这不是一个很好的设置方式。服务业，作为单身者，通常不是用来维系国家的。@DRobinson如果你能把它作为一个答案，我很想听到一个更好的解决方案。
$scope.sharedInfo = sharedInfo;
$scope.$watch('sharedInfo.getError()', function(newValue, oldValue) {
  ...
});