角度相互依赖的服务:避免循环依赖

Angular Interdependent Services: Avoiding circular dependncy

本文关键字:依赖 循环 服务      更新时间:2023-09-26

>我有两个独立的GUI,它们是同一系统的一部分。 一个在屏幕顶部(navEditor(,一个在侧面(routeEditor(。

它们需要两个频繁地相互更新,并调用对方函数。

每个都有保存大部分系统功能的服务。 当我尝试从 A->B 和 B->A 调用函数时,我遇到了一个问题。 当然,它创建了一个循环依赖关系,因为我必须将它们包含在彼此中才能获得访问权限。

我研究了几种解决方案,包括使用 $rootScope.$broadcast。 但是,一个常见的建议(在这里找到:角度JS-非依赖服务之间的通信(建议使用"订阅者/发布者"方法将两者连接在一起。

这通过使用第三个服务并让其他服务将事件和处理程序附加到该服务来避免循环依赖关系。

我更进一步,只是让这个父服务为我的两个系统中的每个系统返回一个带有占位符对象的对象:

//BRIDGE SERVICE
myApp.service('$trafficSys', function(){
     this.sys = {
         navEditor: {}, //poulated by $routeEditor service
         routeEditor: {} ////poulated by $navEditor service
    }
});
//ROUTE-EDITOR
myApp.service('$routeEditor', ['$trafficSys',function($trafficSys) {
    var routeSystem = {
           //entire route editor system goes in here
        }
    $trafficSys.sys.routeEditor = routeSystem;
}]);
//NAV-EDITOR (Same Process as Route Editor)

然后,我只是让我的"navEditor"和"routeEditor"服务包含$trafficSys,然后将它们的所有功能应用于navEditor或routeEditor对象。

想知道的是,这是否被认为是一种反模式,以及我是否更强制而不是声明性。

我对大型应用程序不是很有经验。 我正在学习角度,所以我可以推动自己更多地思考建筑。 然而,我发现我缺乏远见,这让我怀疑我是否以最好的方式做事。

任何建议将不胜感激。

您应该将业务逻辑留给 angular 应用程序的控制器。

让 NAV-EDITOR 和 ROUTE-EDITOR 位于单独的控制器中,并让其业务逻辑(函数调用(存在于一个纤细的控制器中。虽然$trafficSys.sys应该只是一个单例,它被传递到控制器依赖项注入$routeEditor,$trafficSys并$navEditor到控制器中,如下所示:

 myApp.controller('RouteController', ['$scope', '$routeEditor', '$trafficSys' function($scope, $routeEditor) {
      // var trafficSys = $trafficSys.sys 
      //you could even put it on $scope if you need to databind -  $scope.trafficSys = $trafficSys.sys
      //$routeEditor business logic goes here using 
    }]);
myApp.controller('NavController', ['$scope', '$navEditor', '$trafficSys' function($scope, $navEditor) {
      // var trafficSys = $trafficSys.sys 
      //you could even put it on $scope if you need to databind -  $scope.trafficSys = $trafficSys.sys
      //$navEditor business logic goes here
    }]);