Angular 1.3.9 |当控制器 2 发生变化时，服务不会在控制器 1 中更新

Question

一如既往地提前谢谢你。我是 Angular 的新手，正在尝试通过逐渐变得复杂的教程构建待办应用程序来学习。

我现在面临的挑战是试图了解设置全局变量 isLoggedIn 的最佳方法，当用户通过护照登录时该变量将得到更新并且状态可以在控制器之间共享。

这是我的代码：

var todoApp = angular.module('todoApp', []);

todoApp.service('TodoFactory', function() {

this.isLoggedInGlobal = false;

});



todoApp.controller('mainController', ['$scope', '$http', 'TodoFactory', function($scope, $http, TodoFactory) {
    $scope.formData = {due: new Date()};;
    $scope.isLoggedInGlobal = TodoFactory.isLoggedInGlobal;
    $scope.todoData = {deleted: false};

        $scope.getUserTodos = function() {
        $http.get('/api/todos/users')
            .success(function(data) {
              console.log(data)
                $scope.todos = data;
                $scope.isLoggedInGlobal = true;
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
          }

    // when submitting the add form, send the text to the node API
    $scope.createTodo = function() {
        $http.post('/api/todos', $scope.formData)
            .success(function(data) {
                $scope.formData = {}; // clear the form so our user is ready to enter another
                //$scope.todos = data; no longer needed in favor of the below function
                $scope.getUserTodos();
                console.log(data);
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
    };

    // delete a todo after checking it
    $scope.deleteTodo = function(id) {
        $http.delete('/api/todos/' + id)
            .success(function(data) {
              //$scope.todos = data; no longer needed in favor of the below function
              $scope.getUserTodos();
                console.log(data);
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
    };

        $scope.markComplete = function(id) {
        $http.get('/api/todos/complete/' + id)
            .success(function(data) {
              $scope.deleted = true;
              //$scope.todos = data; no longer needed in favor of the below function
              $scope.getUserTodos();
                console.log(data);
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
    };

  }]);

todoApp.controller('userController', ['$scope', '$http', 'TodoFactory', function($scope, $http, TodoFactory) {
 $scope.loginData = {username: 'taylorackley@gmail.com', password: 'Vb578Vb578!'};
    $scope.welcome = "Hello "
    $scope.isLoggedInGlobal = TodoFactory.isLoggedInGlobal;

    // Auth Functions via passport.
        $scope.loginUser = function() {
        $http.post('/api/users/login', $scope.loginData)
            .success(function(data) {
                $scope.loginData = {}; // clear the form so our user is ready to enter another
                $scope.user = data;
                console.log($scope.isLoggedInGlobal);
                console.log(TodoFactory.isLoggedInGlobal);
                $scope.isLoggedInGlobal = true;
                TodoFactory.isLoggedInGlobal = true;
                console.log($scope.isLoggedInGlobal);
                console.log(TodoFactory.isLoggedInGlobal);
                console.log(data);
                $scope.getUserTodos()
              })

            .error(function(data) {
                console.log('Error: ' + data);
            });

    };

您可以看到我将服务注入控制器的位置并将其设置为范围变量。
当在 userController 上调用登录函数时，用户控制器 $scope 变量更新为 true...mainController 变量不会。
当然可以通过更新 mainController 中的范围变量来解决...但这违背了拥有全局变量的意义。
我也尝试了一个简单的工厂返回一个简单的变量和一个不同的方式作为一个函数。:

todoApp.factory('mainFactory', function($scope) {

  var isLoggedInGlobal = false;
  return isLoggedIn;
});

我也有点困惑，因为我也列出了两次 'TodoFactory'。当我取出第一个引用 'TodoFactory' 时，就在我将它作为函数传递之前，我得到了一个未定义的错误。

如有任何帮助，我们将不胜感激。

Answer 1

与其在服务中使用属性，不如使用 getter 和 setter:

todoApp.service('loginService', function() {
    var _loggedIn;

    this.setLoggedIn = function (val) {
        _loggedIn = val;
    };

    this.isLoggedIn = function () {
        return _loggedIn;
    };
});

在您的控制器中，您不使用范围变量，而是调用 loginService.isLoggedIn() 来检查是否有人登录，并 loginService.setLoggedIn(true) 将它们设置为已登录。

在您当前的代码中，您控制器中的 $scope.isLoggedInGlobal 不是对 TodoFactory.isLoggedInGlobal 的引用。当您分配给范围变量时，将复制该值。所以你必须更新两者。它们是完全独立的。

Angular 1.3.9 |当控制器 2 发生变化时，服务不会在控制器 1 中更新

Angular 1.3.9 | Service does not update in controller 1, when change in controller 2

controllers

factories

angularjs