AngularJS项目中跨目录不同控制器如何调用对方内部专属函数？

方案1：$rootScope 事件订阅发布（最优，零架构改造） #

你之前的写法存在语法错误，修正后可直接运行：

1. 在定义$scope.mainFunction的控制器中，订阅自定义事件，同时绑定销毁逻辑避免内存泄漏：

// 写在目标控制器内部
const offCallMainFn = $rootScope.$on('CallMainFunction', (event, incomingData) => {
  $scope.mainFunction(incomingData);
});
// 控制器销毁时取消订阅，避免内存泄漏
$scope.$on('$destroy', offCallMainFn);

2. 在需要触发调用的控制器中，发送事件即可：

// 调用时直接触发事件，传入参数即可
$rootScope.$emit('CallMainFunction', id);

方案2：直接挂载方法到$rootScope（更简单，适合临时快速实现） #

如果不需要多订阅者，直接挂载方法到全局单例$rootScope是成本最低的方案：

1. 在定义$scope.mainFunction的控制器中挂载：

// 写在目标控制器内部
$rootScope.callMainFunction = (incomingData) => {
  $scope.mainFunction(incomingData);
};
// 控制器销毁时清理挂载的方法，避免内存泄漏
$scope.$on('$destroy', () => {
  delete $rootScope.callMainFunction;
});

2. 在需要调用的控制器中直接调用即可：

// 调用前先做存在性判断，避免目标控制器未加载时报错
if ($rootScope.callMainFunction) {
  $rootScope.callMainFunction(id);
}

注意事项 #

• 两种方案均为AngularJS原生支持的能力，完全适配你当前的老旧项目，不需要做架构改造，仅需要修改两个控制器的少量代码即可实现
• 必须添加销毁逻辑，否则重复进入目标控制器时会出现函数重复触发、内存泄漏等问题

内容的提问来源于stack exchange，提问作者Peter The Angular Dude