Angular——配置模块与运行模块

配置模块

通过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>{{str|capitalize}}</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', '$filter', function ($scope, $filter) {

        $scope.str = 'wqx';

    }]);

</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——配置模块与运行模块

最新文章

热门文章