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

本文介绍了AngularJS中模块的配置方法及运行机制,通过具体的示例代码展示了如何使用config方法进行服务配置,并通过run方法优先执行特定功能。

配置模块

通过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>

 

转载于:https://www.cnblogs.com/wuqiuxue/p/8432071.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值