AngularJS中的全局“App”控制器

Question

我注意到在一些教程和代碼示例中浮現在互聯網開發人員的應用程序和模塊中使用全局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...);
    });
});

這種模式還有其他優點或缺點嗎？

Answer 1

純粹是在情境的背景下。 我們舉一個動態更改標題標簽和頁面視圖的示例：

.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() 。

AngularJS中的全局“App”控制器

問題描述

1 個解決方案

解決方案1
4 2013-07-22 14:10:15

AngularJS中的全局“App”控制器

問題描述

1 個解決方案

解決方案1 4 2013-07-22 14:10:15

解決方案1
4 2013-07-22 14:10:15