一、模块

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

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. APP强制退出

    第一种方法: 企业版可以用,Appstore可能被拒,慎用 - (void)exitApplication { AppDelegate *app = [UIApplication sharedAppl ...

  2. SQL Server 2008数据库连接错误

    以Windows身份连接SQL Server 2008数据库时,连接不上,出现如下报错画面: 解决办法:打开services窗口,找到名字类似于SQL Server (xxx)的服务,启动服务. 注: ...

  3. Android Studio 小新兵

    1. java.lang.IllegalStateException: This app has been built with an incorrect configuration. Please ...

  4. 记录点复习题目和linux学习

    哈希怎么底层.key放数组哪部分里面 HashMap实际上是一个“链表散列”的数据结构,即数组和链表的结合体. 开网页怎么获取页面 linux 看进程的cpu 和内存占用率 看哪个端口被占用     ...

  5. 《Django By Example》第一章 学习笔记

    首先看了下目录,在这章里 将会学到 安装Django并创建你的第一个项目 设计模型(models)并且生成模型(model)数据库迁移 给你的模型(models)创建一个管理站点 使用查询集(Quer ...

  6. Find the location of libmysqlclient.so.X file in Linux environments

    I'm putting together a script that has a requirement of knowing libmysqlclient.so.[15|16|18] .so fil ...

  7. rails 表单中默认值

    在表单中加入默认提示值,如(email@email.com): <div class="field"> <%= form.label :email,"E ...

  8. Enjoy Markdown!

    有一个神奇的语言,比HTML简单,它巧妙地将内容与格式结合在一起,它就是Markdown! 下面是一个用C语言写的四则运算小测试~ #include <stdio.h> #include ...

  9. Java设计模式——结构型模式

    Java设计模式中共有7种结构型模式:适配器模式.装饰模式.代理模式.外观模式.桥接模式.组合模式.享元模式.其中对象的适配器模式是各种模式的起源,其关系如下面的图:1.适配器模式 适配器模式将某个类 ...

  10. C# AOP框架入门(转)

    出处:https://www.cnblogs.com/isaboy/p/Csharp_AOP_Log.html AOP面向切面编程(Aspect Oriented Programming),是通过预编 ...