一、config方法

  在模块加载阶段,对模块进行自定义配置

  config可以注入$stateProvider, $urlRouterProvider, $controllerProvider, $provide, $httpProvider等等provider,

  config的工作流程:

  新建一个模块,这个模块中有一个服务,一个自定义指令

 var app = angular.module("myApp", []);  

  app.fatory('myFactory',function(){

    //利用工厂生产  创建一个 服务

    var service = {};

    return service;

  });

  app.directive('myDirectiive',function(){

    //创建 一个 自定义指令

    return {

      template:'<div><button>click me</button></div>'

    }

  });

  angularJS自动编译后的流程是这样的:

var app = angular.module('myApp',[]);
  app.config(function($provide,$compileProvider){
    $provide.factory('myFactory',function(){
    var service = {};
    return service;
    });
    $compileProvider.directive('myDiretive',function(){
      return {
        template:'<div><button>click me</button></div>'
      }
    });
  });

  在模块上添加的服务,指定等,实际上都是在config阶段配置的。

二、run方法

  是应用中最先执行的方法,类似于main方法,run方法只会在angular启动的时候运行一次,定义全局的数据或逻辑,对全局作用域起作用,$rootScope上内容在多个控制器之间可以共享。例如,注册一个全局的事件监听器。每次路由发生变化时候,都执行一个函数来验证用户的权限。

angular.module('myApp', ['ngRoute'])

  .run(function($rootScope, AuthService) {

     $rootScope.$on('$routeChangeStart', function(evt, next, current) {

       // 如果用户未登录  

      if (!AuthService.userLoggedIn()) {

         if (next.templateUrl === "login.html") {

          // 已经转向登录路由因此无需重定向

        } else {

          $location.path('/login');

        }

      }

    });

  });

三、区别

1、执行顺序不同

  config先执行,run后执行。另外,ng启动阶段是 config-->run-->compile/link

2、注入服务类型不同

  config里允许注入的是providerconstance(常量)run里允许注入的是provider和constant,还可以是factory,service,value

服务/阶段 provider factory service value constant
config阶段 Yes No No No Yes
run 阶段 Yes Yes Yes Yes Yes

四、例子

1、config方法例子

  (1)、改变表达式符号

  对$interpolateProvider的服务进行了初始化的配置

var app = angular.module('myApp',[]);

  app .config(['$interpolateProvider',function($interpolateProvider){

     //要想初始配置,我们首先要做模块下面添加config方法,插入一个数组引入相应的供应商,以及相关的回调并注入

    //改变表达式头部的符号

    $interpolateProvider.startSymbol('@@');

    //改变表达式尾部的符号

    $interpolateProvider.endSymbol('@@');

  }]);

  使用时双@显示而不是{{}}形式了:

  <p>@@showText@@</p> 

  (2)、定义路由

var activityModule = angular.module('app.activity', [])
.run(['$log', function ($log) {
$log.debug('app.activity.run()...');
}])
.config(['$controllerProvider', '$compileProvider', '$filterProvider', '$provide', 'scriptDependencyProvider', '$stateProvider',
function ($controllerProvider, $compileProvider, $filterProvider, $provide, scriptDependencyProvider, $stateProvider) {
'use strict';
activityModule.controller = $controllerProvider.register;
activityModule.directive = $compileProvider.directive;
activityModule.filter = $filterProvider.register;
activityModule.factory = $provide.factory;
activityModule.service = $provide.service; $stateProvider.state('activity', {
name: 'activity',
url: '/activity',
controller: ['$scope', '$stateParams', function ($scope, $stateParams) {}],
template: '<div ui-view></div>',
resolve: scriptDependencyProvider.createDependenciesMap(scriptDependencyProvider.activity),
deepStateRedirect: false,
sticky: false
}).state('activity.activityList', {
url: '/activity/ActivityList',
template: '<activity-list-view></activity-list-view>'
});
}
]);

  (3)、项目中实际配置 

app.config([
'$logProvider', '$httpProvider', '$provide', '$stateProvider', '$urlRouterProvider', '$locationProvider', '$sceDelegateProvider',
function ($logProvider, $httpProvider, $provide, $stateProvider, $urlRouterProvider, $locationProvider, $sceDelegateProvider) {
// enable output $log.debug by default
var isDebug = true;
if (Global&& Global.isDebugEnabled) {
isDebug = Global.isDebugEnabled();
}
$logProvider.debugEnabled(isDebug); $httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];
$httpProvider.defaults.useXDomain = true;
//initialize get if not there
if (!$httpProvider.defaults.headers.get) {
$httpProvider.defaults.headers.get = {};
}
//disable IE ajax request caching
$httpProvider.defaults.headers.get['If-Modified-Since'] = 'Mon, 26 Jul 1997 05:00:00 GMT';
// extra
$httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache';
$httpProvider.defaults.headers.get['Pragma'] = 'no-cache'; // configurate app root state
var configurateRoute = function () {
$urlRouterProvider.otherwise("/default");
$locationProvider.html5Mode(false);
}; configurateRoute(); $sceDelegateProvider.resourceUrlWhitelist(['**']); //$routeProvider
// .when('/error', { templateUrl: '/app/myframework/views/error-view.html' })
// .when('/about', { templateUrl: '/app/myframework/views/about-view.html' })
// .otherwise({
// redirectTo: '/'
// }); }
]);

2、run方法例子

(1)、浏览器判断

  定义一个全局逻辑,供应用的不同部分使用

.run(['$rootScope', '$route', '$window', '$location', 'Position', '$cookies', 'Request', '$cookieStore',
function($rootScope, $route, $window, $location, position, $cookies, request, $cookieStore) {
//非微信的登陆
$rootScope.isWeiXinLogin = function() {
//判断是否微信登陆
var ua = window.navigator.userAgent.toLowerCase();
//console.log(ua); //mozilla/5.0 (iphone; cpu iphone os 9_1 like mac os x) applewebkit/601.1.46 (khtml, like gecko) version/9.0 mobile/13b143 safari/601.1
if (ua.match(/MicroMessenger/i) == 'micromessenger') {
console.log(" 是来自微信内置浏览器");
return true;
} else {
console.log("不是来自微信内置浏览器");
return false;
}
};
]);

  控制器中使用:

angular.module('autumnswind').controller('OrderCtrl', ['$rootScope', '$scope', 'Request', '$cookies', '$window', '$routeParams', '$location', 'Tool',
function($rootScope, $scope, request, $cookies, $window, $routeParams, $location, tool) {
if ($rootScope.isWeiXinLogin()) {
...
}
}
]);

(2)、定义全局数据

var app = angular.module('myApp',[]);
app.run(['$rootScope',function($rootScope){
$rootScope.name = 'hello';
}]);

(3)、项目中例子

 run中代码,最先执行,类似main方法

.run(['$log', '$templateCache', function ($log, $templateCache) {
$log.debug('app.run()...');
window.$templateCache = $templateCache;
if (GlobalObj.templateCache) {
for (var i = 0; i < GlobalObj.templateCache.templates.length; i++) {
var template = GlobalObj.templateCache.templates[i];
$templateCache.put(template.key, template.value);
}
}
}]);

AngularJS config run 及区别和例子的更多相关文章

  1. Kotlin之let,apply,with,run函数区别(转)

    转自:https://blog.csdn.net/guijiaoba/article/details/54615036 Kotlin之let,apply,with,run函数区别 重新整理 重新整理了 ...

  2. Java多线程系列--“基础篇”03之 Thread中start()和run()的区别

    概要 Thread类包含start()和run()方法,它们的区别是什么?本章将对此作出解答.本章内容包括:start() 和 run()的区别说明start() 和 run()的区别示例start( ...

  3. java多线程系类:基础篇:03Thread中的start()和run()的区别

    这个系类的内容全部来源于http://www.cnblogs.com/skywang12345/p/3479024.html.特别在此声明!!! 概要 Thread类包含start()和run()方法 ...

  4. 线程入门之start()和run()的区别

    package com.thread; /** * start()和run()的区别 * start():并行执行 * run():方法调用,顺序执行 * @author 95Yang */ publ ...

  5. Java多线程3:Thread中start()和run()的区别

    原文:http://www.cnblogs.com/skywang12345/p/3479083.html start() 和 run()的区别说明start():它的作用是启动一个新线程,新线程会执 ...

  6. Java基础加强之并发(三)Thread中start()和run()的区别

    Thread中start()和run()的区别 start() : 它的作用是启动一个新线程,新线程会执行相应的run()方法.start()不能被重复调用.run()   : run()就和普通的成 ...

  7. java 多线程系列基础篇(三)之start()和run()的区别

    概要 Thread类包含start()和run()方法,它们的区别是什么?本章将对此作出解答. start() 和 run()的区别说明 start() : 它的作用是启动一个新线程,新线程会执行相应 ...

  8. Java多线程和并发(二),Thread中的start和run的区别

    目录 1.调用run方法 2.调用start方法 3.start和run的区别 二.Thread中的start和run的区别 1.调用run方法 public class ThreadTest { p ...

  9. sleep()和wait()的区别?notify()和notifyAll()的区别?start()和run()的区别?

    sleep()和wait()的区别? 这两个方法来自不同的类分别是Thread和Object sleep方法没有释放锁,而wait方法释放了锁,使得其他线程可以使用同步控制块或者方法.wait,not ...

随机推荐

  1. compatible with

    和系统函数冲突

  2. post方式发送请求报文

    $url="http://www.test.com/04_demo_weather.php?id=5"; $ci=curl_init($url); curl_setopt($ci, ...

  3. 【UI测试】--安全性

  4. IOS初级:观察者

    //为一个编辑框myField添加观察者,观察当编辑框文字改变时通知 //方法textChange是通知发生是要做的事情 [[NSNotificationCenter defaultCenter] a ...

  5. [C#]WinForm动态删除控件 Controls.Remove()

    今天遇到一个奇怪的问题,在WinForm内动态添加Button后再动态的移除,发生稀奇古怪的现象,Button控件只被规律的移除,没有完全移除 foreach (Control c in this.C ...

  6. Reading CLR via c# 4th Edition

    In fact, at runtime, the CLR has no idea which programming language the developer used for thesource ...

  7. Time的各种变量unity3d

    Time.time:(只读)表示从游戏开发到现在的时间,会随着游戏的暂停而停止计算. Time.timeSinceLevelLoad:(只读)表示从当前Scene开始到目前为止的时间,也会随着暂停操作 ...

  8. php获取响应状态码

    $ch = curl_init('http://www.jb51.net'); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); curl_exec($ch); ...

  9. 2018.10.26 bzoj2721: [Violet 5]樱花(数论)

    传送门 推一波式子: 1x+1y=1n!\frac 1 x+\frac 1 y=\frac 1 {n!}x1​+y1​=n!1​ =>xy−x∗n!−y∗n!xy-x*n!-y*n!xy−x∗n ...

  10. Java基础之多线程没那么复杂!

    多线程的引入 1.什么是多线程 线程是程序执行的一条路径,一个进程中可以包含多条线程;多线程并发执行可以提高程序的效率</br> 2.进程和线程之间的关系 操作系统可以同时执行多个任务,每 ...