在Angular.js中主模块的$ scope中调用函数

时间:2016-03-02 21:16:27

标签: javascript angularjs

我有一个Angular.js项目,主要模块定义如下:

var app = angular.module('app', [ /* Some libraries... */
    'UserControllers' ]);

主模块有一个控制器定义如下:

app.controller('MainController', function($scope, $location) {
    var UserId = null;
    var Username = null;

    $scope.setUserInfo = function(userId, username) {
        UserId = userId;
        Username = username;
    };
}

在网站的主页面中,用户可以加载外部登录表单并将其加载到这样的模式中:

    function showModal($uibModal, $previousState) {
        $previousState.memo("modalInvoker");
        var stateName = this.name;
        var templateUrl = this.templateUrl;
        $uibModal.open({
            templateUrl: templateUrl,
            controller: function ($uibModalInstance, $scope) {
                var isopen = true;
                $uibModalInstance.result.finally(function() {
                    isopen = false;
                    $previousState.go("modalInvoker");
                });
                $scope.close = function () {
                    $uibModalInstance.dismiss('close');
                };
                $scope.$on("$stateChangeStart", function(evt, toState) {
                    if(!toState.$$state().includes[stateName]) {
                        $uibModalInstance.dismiss('close');
                    }
                });
            }
        });
    }

加载页面中的表单使用在主页中加载的文件中定义的控制器,如下所示:

(function() {
"use strict";

var login = angular.module("UserControllers", [  ]);
login.controller("LoginCtrl", function($http, $scope) {
    /* Login checks and requests... */ 
    /* Need to call the setUserInfo */
}
}();

完成所有登录检查后,我基本上需要调用主模块/页面范围内定义的函数setUserInfo。我可以通过调用$ scope。$ parent.close()来关闭模态,但我不能调用setUserData,因为它似乎在另一个范围内。

非常感谢您的帮助。

2 个答案:

答案 0 :(得分:2)

将rootScope用于用户数据:

app.controller('MainController', function($scope, $rootScope, $location) {
    var UserId = null;
    var Username = null;

    $rootScope.setUserInfo = function(userId, username) {
        UserId = userId;
        Username = username;
    };
}

(function() {
"use strict";

var login = angular.module("UserControllers", [  ]);
login.controller("LoginCtrl", function($http, $scope, $rootScope) {
    /* Login checks and requests... */ 
    $rootScope.setUserInfo(uid, un); //...
}
}();

答案 1 :(得分:0)

var myApp = angular.module('example.services');
 function example () {
   Var user = this;
     Student.setData = function(data) {
        user.data = data;
      }
    }
myApp.service('example',[example]);

现在将服务包含在您的控制器&&模态控制器:

app.controller('MainController', function($scope, $rootScope, $location, example) {
//now call your set user data function to share data from modal to  controller
var UserId = null;
var Username = null;

    $rootScope.setUserInfo = function(userId, username) {
      UserId = userId;
      Username = username;
    };
}

    (function() {
"use strict";

var login = angular.module("UserControllers", [example ]);
login.controller("LoginCtrl", function($http, $scope, $rootScope, example) {
  /* Login checks and requests... */ 
  $rootScope.setUserInfo(uid, un); //...
  }
}();