4

我注意到互联网开发人员在他们的应用程序和模块中使用全局 AppController 的一些教程和代码示例。

在 AngularJS 中创建全局 AppController 是最佳实践吗？

我确实看到了一些好处，例如能够在“全局”范围内处理事件，例如：

app.controller('AppController', function($scope, $rootScope, $route, $location){

    $rootScope.$on('$routeChangeStart', function(event, current, previous) {
        console.log('Do something...');
    });

    $rootScope.$on('$routeChangeSuccess', function(event, current, previous) {
        console.log('Do something...);
    });
});

这种模式还有其他优点或缺点吗？

4

1 回答 1

4

纯粹根据情况。让我们举一个动态改变标题标签和页面视图的例子：

.config(['$routeProvider','$locationProvider',function($routeProvider,$locationProvider){
 $routeProvider.when('/', {
    template: '/views/home.html',
    title:'Home'
  });
  $locationProvider.html5Mode(true);
}]);

.controller('app', ['$scope','$route','$location',function($scope,$route,$location){
  $scope.$on("$routeChangeSuccess",function($currentRoute,$previousRoute ){
    $scope.title = $route.current.title;
    $scope.page = $route.current.template;
  });
}]);

现在我们的标题和页面视图都通过包装我们的应用程序的应用程序级控制器动态加载。这可能非常有用。

<html lang="en" ng-controller="app">
<head>
<title>{{title}}</title>
</head>
<body>
<ng-include src="page"></ng-include>
</body>
</html>

这是何时不使用它的示例。假设我们的部分页面之一从 API 返回数据：

<!-- search.html -->
<div ng-repeat="item in items">
{{item.title}}
</div>

在我们的应用级控制器中，我们通过广播提取数据：

$scope.$on('searchComplete',function(d){
  $scope.items = d
});

但是，该部分将按我们的意图显示数据 - 当其他子部分使用items覆盖范围时可能会出现问题。

<!-- other-search.html -->
<div ng-controller="OtherSearch" ng-click="search()">
<div ng-repeat="item in items">
{{item.title}}
</div>
</div>

在这部分，ng-click是引导用户的请求。因此，如果应用级控制器已经绑定items在父级中，用户将在切换到此部分时看到项目列表，即使他们从未触发过search().

于 2013-07-22T14:10:15.833 回答