Question

我一直试图在Angular中实现这个简单的功能，但没有成功。

我有两个控制器和一个服务。该服务提供了一种共享方法来检索用户是否登录;

app.factory("shared",["$rootScope",function($rootScope){
    var data = {};
    data.val = false;
    data.get = function() {
        return data.val;
    },
    data.set = function(val) {
        data.val = val;
    };
    return data;

}]);

然后我在登录/注销栏上附加了一个控制器，在ng-show和ng-hide的帮助下，应该更改登录和注销链接。这是一个HTML代码：

<ul class="reg" ng-controller="mainCntr">
        <li ng-hide="shared.get()"><a href="/register"> Signup </a></li>
        <li ng-hide="shared.get()"><a href="/login">Login</a></li>
        <li ng-show="shared.get()"><a href="/logout">Logout</a></li>
    </ul>

并且mainCntr附于此：

 app.controller("mainCntr,["$scope","shared","$rootScope",function($scope,shared, $rootScope){
       $scope.$watch("shared.get()",function(newval){
          console.log(newval);
      },true);
    }]);

最后，当我们登录/登录页面时，我有登录表单的登录控制器。我应该注意到上面的登录/注册链接HTML总是在index.html页面上。所以，loginCntr在下面：

app.controller("loginCntr",["$scope","$http", "$window","$rootScope", "$location","shared",function($scope,$http, $window, $rootScope,$location,shared){
      $scope.login = "";
      $scope.password = "";
      $scope.response = "";
      $scope.loggedin = false;
      $scope.submit = function(isValid) {
          if (isValid) {
      $http({
          method: "POST",
          url: "/authenticate",
          data: $.param({login:$scope.login,password:$scope.password}),
          headers: {"Content-Type": "application/x-www-form-urlencoded"}
      }).success(function(data,status,headers,config){
          $window.sessionStorage.token = data.token;
          console.log($window.sessionStorage.token);
          $scope.response = "You logged in successfully";
          shared.set(true); /////// Here I set shared valued to true when the user is logged
      }).error(function(data,status,error,config){
          delete $window.sessionStorage.token;
          $scope.response = data.response;
      });
  };
      };
}]);

所以，那就是它，但它不起作用。作为Angular的新手，我很难弄清楚出了什么问题。可能是因为＆＃34;共享＆＃34; value是在异步回调中设置的，因此从不读取，因为登录部分已经加载了？

Answer 1

为什么你不尝试$ emit事件监听器。喜欢：

///****mainCntr
 app.controller("mainCntr,["$scope","shared","$rootScope",function($scope,shared, $rootScope){
       $scope.$on("loginEvent", function($event, args){
        alert(args.msg);
     });//Listen $emit Event
    }]);

///****loginCntr
app.controller("loginCntr",["$scope","$http", "$window","$rootScope", "$location","shared",function($scope,$http, $window, $rootScope,$location,shared){
      $scope.login = "";
      $scope.password = "";
      $scope.response = "";
      $scope.loggedin = false;
      $scope.submit = function(isValid) {
          if (isValid) {
      $http({
          method: "POST",
          url: "/authenticate",
          data: $.param({login:$scope.login,password:$scope.password}),
          headers: {"Content-Type": "application/x-www-form-urlencoded"}
      }).success(function(data,status,headers,config){
          $window.sessionStorage.token = data.token;
          console.log($window.sessionStorage.token);
          $scope.response = "You logged in successfully";
          $scope.$emit("loginEvent", {msg : "Login Successful..."}) /////// Emit an event
      }).error(function(data,status,error,config){
          delete $window.sessionStorage.token;
          $scope.response = data.response;
      });
  };
      };
}]);

将Loggedin状态传输到Angular中的另一个控制器

1 个答案: