Question

我正在使用路由提供程序，如下所示，

var appModule = angular.module('ngLogin', ['ngRoute','restangular','btford.socket-io','ngSanitize','xeditable']);

appModule.config(['$routeProvider',
              function($routeProvider) {
                $routeProvider.
                when('/home', {
                  templateUrl: 'sample/homepage.html',
                    controller: 'ngHomeControl'
                    }).
                when('/contacts', {
                  templateUrl: 'sample/homepage.html',
                    controller: 'ngContactControl'
                  });
            }]);

在这里，我需要调用从ngHomeControl到ngContactControl的函数。

我尝试了如下，但没有调用该函数。

appModule.controller('ngHomeControl', function($scope,$routeParams,socket,Restangular,$http) {

$rootScope.$broadcast('getFriendList',{"userName":userName});

});

appModule.controller('ngContactControl', function($scope,$routeParams,$rootScope,socket,sharedProperties,Restangular,$http,$timeout) {

$scope.$on("getFriendList",function(event,data)
        {
          console.log('getFriendList');
        });
});

任何人都可以帮我解决吗？

Answer 1

这不起作用，因为一次只实例化一个控制器（在您的情况下）。

正确的方法是使用服务。有一个很好的article会帮助你解决这个问题。

另请参阅此answer有关如何创建服务的信息。

根据这两个资源，您应该提出类似的内容：

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

appModule.config(['$routeProvider',
              function($routeProvider) {
                $routeProvider.
                when('/home', {
                  templateUrl: 'home.html',
                    controller: 'ngHomeControl'
                    }).
                when('/contacts', {
                  templateUrl: 'contacts.html',
                    controller: 'ngContactControl'
                  });
            }]);

appModule.service('friendsService', function(){
    this.getFriendList = function () {
        return ['John', 'James', 'Jake'];
    }
});

appModule.controller('ngHomeControl', function($scope, friendsService) {
    $scope.homeFriends = friendsService.getFriendList();
});

appModule.controller('ngContactControl', function($scope, friendsService) {
    $scope.contactFriends = friendsService.getFriendList();
});

有一个完整的工作JSFiddle，所以你可以测试它。还请检查控制台输出以查看实例化使用过的组件的时间。

每次路由更改时，您都会看到控制器被实例化 - 它们通过模板内部使用的ngController指令隐式实例化。该服务仅实例化一次，这是在第一次需要/注入时。

Answer 2

您的事件侦听器未被触发的原因是因为您的ngContactControl时没有/home个实例。您可以创建一个处理范围事件的父控制器，但更好的方法是使用在需要此功能的控制器之间共享的服务。

有关如何通过服务共享数据和/或功能的示例，请参阅this plunker。

使用routeprovider时在两个控制器之间调用函数

2 个答案: