在Angular中,从分离视图控制器中改变事件的作用域变量

Changing scope variables on events from a separates view's controller in Angular?

本文关键字:事件 改变 作用域 变量 控制器 视图 Angular 分离      更新时间:2023-09-26

假设您有一个登录系统,其中导航位于"主"视图中,该视图永远不会更改,它还包含一个占位符ng-model用于用户名:

$scope.userName = Session.userName();

然而,这是在页面加载时分配的,这很糟糕。如何使登录控制器在$http请求返回成功后立即更改主控制器上的此变量?

$scope.login = function() { 
        $http.post('http://restfulservice.com', 
            angular.toJson($scope.loginUser))
    .success( function (data, status, headers, config) {
            if (data.out) {
            var data= JSON.parse(data.out);
            Session.userName(data.Nombre);
            Session.memorizarId(datos.idCliente);
            Session.memorizarLogged(true);
      }

你可以看看angularJs的事件机制$broadcast$emit

一旦登录成功,你可以广播一条消息,无论哪个控制器正在监听这条消息,它都会得到广播的消息并相应地采取行动。

$scope.login = function() { 
        $http.post('http://restfulservice.com', 
            angular.toJson($scope.loginUser))
    .success( function (data, status, headers, config) {
            if (data.out) {
            var data= JSON.parse(data.out);
            Session.userName(data.Nombre);
            Session.memorizarId(datos.idCliente);
            Session.memorizarLogged(true);
            //broadcast the message passing the user info optionally
            $rootScope.$broadcast('user-logged-in', data);
      }

主控制器内部

$rootScope.$on('user-logged-in', function (user) {
  $scope.userName = Session.userName();
  //Or using the broadcasted user object
  $scope.userName = user.Nombre;
});

来自angularJs文档:

事件生命周期从$broadcast所在的作用域开始调用。在此范围内侦听name事件的所有侦听器都得到收到通知。之后,事件传播到所有直接和间接当前作用域的作用域,并同时调用所有已注册的侦听器的方式。事件无法取消。

rootScope.Scope美元https://docs.angularjs.org/api/ng/type/