컨트롤러에서 서비스 변수가 업데이트되지 않음

컨트롤러에서 서비스 변수가 업데이트되지 않음

ng-view 밖에 있는 Navbar Ctrl이 있습니다.사용자를 로그인 시키기 위해 서비스와 대화하는 로그인 컨트롤러가 있습니다.사용자가 로그인이 되면 사용자의 이메일 주소로 Navbar를 업데이트했으면 합니다.하지만 사용자가 로그인하면 Navbar 스코프가 "Auth" 서비스에 로드된 데이터로 업데이트되지 않는 것 같습니다.

이것은 나의 주 색인입니다.html:

<div class="navbar navbar-inverse navbar-fixed-top">

        <div class="navbar-inner">
            <div class="container">
                <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>
                <a class="brand" href="#">Brim</a>

                <div class="pull-right"  ng-controller="NavbarCtrl">
                    <div ng-click="refresh()">hello</div>
                    {{ user.email }}
                </div>
            </div>
        </div>

    </div>

    <div class="container" ng-view>

그리고 나의 서비스:

.factory('Auth', function($resource) {
    var authenticated = false;
    var user = {};
    return {
        isAuthenticated: function () {
            return authenticated;
        },
        getUser: function() {
            return user;
        },
        login: function(loginUser, callback) {
            user =  {email:'email@email.com'}
            authenticated = true;
            callback(true);
            //actual code for logging in taken out for brevity
        }
    }
})

로그인 및 Navbar 컨트롤러:

function LoginCtrl($scope, $location, Auth) {

$scope.login = function() {
    Auth.login($scope.user, function(success) {
        if(success) $location.path('/dashboard');
        //console.log(Auth.getUser())
    });
}

}

function NavbarCtrl($scope, Auth)  {

//thought this should work
$scope.user = Auth.getUser();

//experimenting unsuccessfully with $watch
$scope.$watch(Auth.isAuthenticated(),function () {
    $scope.user = Auth.getUser()
})

//clicking on a refresh button is the only way I can get this to work
$scope.refresh = function() {
    $scope.user = Auth.getUser()
}
}

조사 결과 $scope.user = Auth.getUser()가 작동할 것으로 생각했지만, 사용자가 로그인했을 때 Navbar를 어떻게 업데이트할 수 있는지 전혀 모르겠습니다.어떤 도움이라도 주신다면 미리 감사드립니다.

업데이트: 음, 당신은 매일 새로운 것을 배웁니다.그냥 제거.()함수의 결과를 확인하는 방법:

$scope.$watch(Auth.isAuthenticated, function() { ... });

Updated fiddle

이 fiddle에서, 'watch1'과 'watch3'이 둘 다 어떻게 두 번째 값을 유발하는지 주목하십시오.$scope.isAuthenticated변화들.

따라서 서비스에 정의된 프리미티브 값의 변경을 감시하는 일반적인 기술은 다음과 같습니다.

• 원시값을 반환하는 API/메소드를 정의합니다.
• $저 방법 보기

서비스에 정의된 개체 또는 배열의 변경 사항을 확인하려면:

• 개체/어레이를 반환(참조)하는 API/메소드를 정의
• 서비스에서 개체/배열만 수정할 수 있으므로 재할당하지 마십시오.
  예를 들어, 이 작업을 수행하지 마십시오.user = ...;
  대신 다음을 수행합니다.angular.copy(newInfo, user)또는 이 항목:user.email = ...
• 일반적으로 로컬 $scope 속성에 해당 메서드의 결과를 할당하므로 $scope 속성은 실제 개체/배열에 대한 참조가 됩니다.
• $범위 속성 보기

예:

$scope.user = Auth.getUser();
// Because user is a reference to an object, if you change the object
// in the service (i.e., you do not reassign it), $scope.user will
// likewise change.
$scope.$watch('user', function(newValue) { ... }, true);
// Above, the 3rd parameter to $watch is set to 'true' to compare
// equality rather than reference.  If you are using Angular 1.2+
// use $watchCollection() instead:
$scope.$watchCollection('user', function(newValue) { ... });

---

원래 답변:

함수의 결과를 보려면 $watch a function을 통과해야 합니다.

$scope.$watch( function() { return Auth.isAuthenticated() }, function() { ... });

Fiddle. Fiddle에서, 값이 다음과 같은 경우 'watch3'만 두 번째로 트리거하는 방법을 주목하십시오.$scope.isAuthenticated변화들.(이들은 모두 $watch 초기화의 일부로 처음에 트리거합니다.)

변경 시도

$scope.$watch(Auth.is Authenticated(), 함수() {$scope.user = Auth.getUser()})

로.

$scope.$watch(Auth.is Authenticated(), 함수() {$scope.user = Auth.getUser() }, true)

자세한 설명은 AungularJs $watch 설명서를 살펴보십시오. 기본값은 false이며, 이는 Angular가 첫 번째 매개 변수 값의 변경을 참조로 감지하는 반면 true를 전달하면 검사가 동등하게 수행됨을 의미합니다.매개 변수 a 함수이면 함수에 대한 참조가 항상 동일하므로 검사는 항상 false를 반환합니다.

으로.user당신의 가변적인 이름은 일반적으로 좋은 생각이 아닙니다.요로 적이 .currentUser모든 것이 다 제게 효과가 있었습니다.

언급URL : https://stackoverflow.com/questions/15380140/service-variable-not-updating-in-controller