Angular——配置模塊與運行模塊
阿新 • • 發佈:2018-02-08
doctype script .config name col tro ali 除了 實現
配置模塊
通過config方法實現對模塊的配置,AngularJS中的服務大部分都對應一個“provider”,用來執行與對應服務相同的功能或對其進行配置。比如$log、$http、$location都是內置服務,相對應的“provider”分別是$logProvider、$httpProvider、$locationPorvider。
基本使用
<!DOCTYPE html> <html lang="en" ng-app="App"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body ng-controller="DemoController"> <h1>{{now}}</h1> <script src="../libs/angular.min.js"></script> <script> var App = angular.module(‘App‘, []); App.config([‘$logProvider‘, ‘$filterProvider‘, function ($logProvider, $filterProvider) { $logProvider.debugEnabled(false);//禁用debug功能 //新增一個過濾器 $filterProvider.register(‘capitalize‘, function () { return function (input) { return input[0].toUpperCase() + input.slice(1); } }); }]); App.controller(‘DemoController‘, [‘$scope‘, ‘showTime‘, function ($scope, showTime) { $scope.now= showTime.now; }]); </script> </body> </html>
運行模塊
服務也是模塊形式存在的對且對外提供特定功能,前面學習中都是將服務做為依賴註入進去的,然後再進行調用,除了這種方式外我們也可以直接運行相應的服務模塊,AngularJS提供了run方法來實現。
不但如此,run方法還是最先執行的,利用這個特點我們可以將一些需要優先執行的功能通過run方法來運行,比如驗證用戶是否登錄,未登錄則不允許進行任何其它操作。
基本使用
<!DOCTYPE html> <html lang="en" ng-app="App"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <h1>{{name}}</h1> <script src="../libs/angular.min.js"></script> <script> var App = angular.module(‘App‘, []); App.run([‘$rootScope‘, function ($rootScope) { $rootScope.name = ‘wqx‘; }]); </script> </body> </html>
Angular——配置模塊與運行模塊