一、模块

　　模块是一些功能的集合，如控制器、服务、过滤器、指令等子元素组成的整体。

1、注册和使用

　　模块相当于是一个注册表，保存着名字和编程元素的对照表，可存入也可取出。

　　angular.module('com.ngnice.app').service('ui',function(){..});

　　该代码的意思是，先取出名字为'com.ngnice.app'的模块，然后把function(){..}作为回调函数以ui为名字注册进去一个服务，其他编程元素通过该名字可以从模块中取出来使用。

2、依赖关系

　　模块可以依赖其他模块，模块间有依赖关系。

　　有个公用模块common,要用其中的名为authHandler的service，我们必须先声明这种依赖，否则，即使引用了模块common所在的js文件，也无法找到。另外，angularjs可以自动检测出循环依赖，以避免出现无限递归。

　　angular.module('com.ngnice.app'，['common'，'m1']);

　　m1可以使用common中的编程元素，不需要定义模块m1依赖模块common,只要根模块(ng-app对应的模块)依赖各个模块就行，如service。实例如下：

<!DOCTYPE html>

<html ng-app="myApp">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <meta charset="utf-8" />

    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

</head>

<script>

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

    common.service("testService",function(){this.name="test111";})

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

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

    m1.controller("Ctr1", function ($scope, testService) {

      $scope.name = testService.name;

    });

  </script>

</head>

<body>

  <form>

  <div ng-controller="Ctr1">

      {{name}}

    </div>

  </div>

  </form>

</body>

</html>

　　运行结果;

　　

3、module方法定义

　　模块的创建和获取利用以下方法：　　

　　angular.module(name, [requires], [configFn]);

　　name：字符串类型，代表模块的名称；

　　requires：字符串的数组，代表该模块依赖的其他模块列表，如果不依赖其他模块，用空数组即可；

　　configFn：用来对该模块进行一些配置。

// 传递参数不止一个,代表新建模块;空数组代表该模块不依赖其他模块

var createModule = angular.module("myModule", []);

// 只有一个参数(模块名),代表获取模块

// 如果模块不存在,angular框架会抛异常

var getModule = angular.module("myModule");

二、provide

　　module和provide是用来注册服务到injector中的。可以看到$provide提供了provider()、constant()、value()（与constant区别是value可修改值）、factory()、service()来创建各种不同性质的服务；angular.Module中也提供了这5个服务注册方法。provide可以直接在config阶段注入使用

　　module只是provide的语法糖而已

　　constant

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

app.config(function ($provide) {

  $provide.constant('movieTitle', 'The Matrix');

});

//单元测试

app.controller('ctrl', function (movieTitle) {

  expect(movieTitle).toEqual('The Matrix');

});

　　语法糖：

app.constant('movieTitle', 'The Matrix');

　　其编译后，也是在config里执行的

　　provider

　　其是一个可配置的factory,config只能注入provider即供应商

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

app.provider('movie', function () {

  var version;

  return {

    setVersion: function (value) {

      version = value;

    },

    $get: function () {

      return {

          title: 'The Matrix' + ' ' + version

      }

    }

  }

});

app.config(function (movieProvider) {

  movieProvider.setVersion('Reloaded');

});

app.controller('ctrl', function (movie) {

  expect(movie.title).toEqual('The Matrix Reloaded');

});

AngularJS 模块及provide的更多相关文章

  1. 4.了解AngularJS模块和依赖注入

    1.模块和依赖注入概述 1.了解模块 AngularJS模块是一种容器,把代码隔离并组织成简洁,整齐,可复用的块. 模块本身不提供直接的功能:包含其他提供功能的对象的实例:控制器,过滤器,服务,动画 ...

  2. AngularJS模块的详解

    AngularJS模块的详解 在讲angularjs的模块之前,我们先介绍一下angular的一些知识点: AngularJS是纯客户端技术,完全用Javascript编写的.它使用的是网页开发的常规 ...

  3. AngularJS 模块& 表单

    模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 应用("myApp") 带有控制器 ("myCtrl&qu ...

  4. AngularJS 模块

    模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 你可以通过 AngularJS 的 angular.module 函数来创建模块: &l ...

  5. AngularJS学习之旅—AngularJS 模块(十五)

    一.AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 1.创建模块 通过 AngularJS 的 angular ...

  6. AngularJS标准Web业务流程开发框架—1.AngularJS模块以及启动分析

    前言: AngularJS中提到模块是自定义的模块标准,提到这不得不说AngularJS是框架中的老大哥,思想相当的前卫..在这框架满天横行的时代,AngularJS有些思想至今未被超越,当然仁者见仁 ...

  7. 在文件中的AngularJS模块

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  8. 在body中的AngularJS模块

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  9. 【13】AngularJS 模块

    AngularJS 模块 模块定义了一个应用程序.(魔芋:也就是说一个ng-app代表一个应用程序,也就是一个模块,module) 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通 ...

随机推荐

  1. 1.3 Java中的标识符和关键字

    1.标识符 含义:标识符用于给程序中的类.变量.方法命名的符号. 组成:数字(0-9).字母(a-z)(A-Z).下划线(_).美元符号$. 命名规则:1.数字不能够作为命名符号的开头 2.不能够使用 ...

  2. [Python]Python章1　Python中_的故事

    _xx 单下划线开头 Python中没有真正的私有属性或方法,可以在你想声明为私有的方法和属性前加上单下划线,以提示该属性和方法不应在外部调用.如果真的调用了也不会出错,但不符合规范. 本文为译文,版 ...

  3. C++11与Unicode及使用标准库进行UTF-8、UTF-16、UCS2、UCS4/UTF-32编码转换

    zt https://blog.poxiao.me/p/unicode-character-encoding-conversion-in-cpp11/ Unicode Unicode是计算机领域的一项 ...

  4. 【UI测试】－－易用性

  5. ListView item中有button或EditText时 点击事件失效问题的解决

    加入:android:descendantFocusability="blocksDescendants" 代码如下: <LinearLayout xmlns:android ...

  6. kbmmw 与extjs 的初次结合

    前面写了extjs 的安装,今天写一下kbmmw 与extjs 的结合,参照delphi 产品经理marco文章 . 由于extjs 设计时要读取服务器端的数据,所以先要做一个rest 服务器. 先要 ...

  7. clion配置c/c++环境

    打开这个界面  点击添加Cygwin选择下载的Cygwin在进行下面的配置 去网站https://www.cygwin.com/选择路径即可(这里只写了配置过程中的关键步骤并且附上IDE的链接直接安装 ...

  8. 28、shareSDK分享以及 QQ应用平台申请遇到的问题

    第一点:菜单列表没出来 未添加白名单 第二点: QQ平台申请,和安卓共用一个APP名字,出现的 问题 第三点

  9. 2018.10.26 NOIP模拟 图（最小生成树+线段树合并）

    传送门 首先最开始说的那个一条路径的权值就是想告诉你两个点之间的贡献就是瓶颈边的权值. 那么肯定要用最小生成树算法. 于是我考场上想了30min+30min+30min+的树形dpdpdp 发现转移是 ...

  10. 牛客训练四：Applese 涂颜色（费马小定理+快速幂）

    题目链接:传送门 思路: 考虑每一列有2种颜色,总共有n行,每一行的第一个格确定颜色,由于左右颜色不相同,后面的行就确定了. 所以总共有2^n中结果. 由于n太大,所以要用到费马小定理a^n%mod= ...