我有两个页面和两个控制器,可以对同一数据集执行搜索。有一种简单的形式来指定搜索条件。另一个允许用户在地图上选择数据(通过选择区域或单击地图上的要素)。
然后,搜索结果将显示在搜索控件下方(同一页面上)的数据表中。
因此,控制器具有不同的搜索功能,但也共享许多共同的行为,即显示网格、分页、重新加载、批量编辑网格中的数据等。
因此,两个控制器中都会重复出现多个功能,有时略有不同,有时完全相同。
页面中显示数据的部分也是共享模板,包含在ng-include
在两个搜索页面上。
这是一个例子:
$scope.selectAllRows = function(){
var selectedItems = $scope.searchState.selectedItems;
angular.forEach($scope.searchState.searchResult.rows, function(row){
// add only if not already selected
if(selectedItems.indexOf(row) < 0){
selectedItems.push(row);
}
});
};
该函数选择表中的所有行。它绑定到ng-click
页面上的按钮。
还有许多其他类似的函数,基本上从$scope
,执行一些逻辑,并将新的东西放回$scope
.
我想删除这些函数的重复并将常见行为重新组合到单个代码单元中。
注意:我想在这里分享的是行为,而不是数据。这些函数将执行相同的逻辑,但作用域不同。
因为这些实际上是演示/UI 的东西,并且需要放在$scope
,我不认为可以使用服务,因为$scope
是一个严格的控制器事物,不能注入到服务中。
我正在尝试在不同的文件中定义一个独立函数,并从两个控制器调用此函数:
myapp.defineCommonControllerBehaviour = function($scope, someOtherService){
$scope.selectAlRows = function(){....}
$scope.someOtherCommonTask = function(){
someOtherService.doTheTask();
}
//etc...
};
//controller 1
myapp.defineCommonBehaviour($scope, someOtherService);
//controller 2
myapp.defineCommonBehaviour($scope, someOtherService);
它可以工作,但不是很优雅,因为它在任何 Angular 模块之外的全局范围内定义了一个函数。
有没有一种有角度的本地方式来实现这一点?或者至少更符合 Angular 架构?