AngularJS高级程序设计读书笔记 -- 服务篇
服务是提供在整个应用程序中所使用的任何功能的单例对象.
单例 : 只用一个对象实例会被 AngularJS 创建出来, 并被程序需要服务的各个不同部分所共享.
1. 内置服务
一些关键方法也被 AngularJS 成为服务. 如 $scope, $http.
2. 自定义服务
2.1 Module.service(name, constructor)
service 方法由两个参数: 服务名和调用后用来创建服务对象的工厂函数. 当 AngularJS 调用工厂函数时, 会分配一个可通过 this 关键字访问的新对象, 我们就可以使用这个对象来定义 today 和 tomorrow 属性.
示例代码:
<!DOCTYPE html>
<html ng-app="exampleApp">
<head>
<title>AngularJS Demo</title>
<link href="bootstrap.css" rel="stylesheet" />
<link href="bootstrap-theme.css" rel="stylesheet" />
<script src="angular.js"></script>
<script>
var myApp = angular.module("exampleApp", []);
myApp.controller("dayCtrl", function ($scope, days) { // 依赖注入服务
$scope.day = days.today;
});
myApp.controller("tomorrowCtrl", function ($scope, days) { // 依赖注入服务
$scope.day = days.tomorrow;
});
myApp.directive("highlight", function ($filter) {
var dayFilter = $filter("dayName");
return function (scope, element, attrs) {
if (dayFilter(scope.day) == attrs["highlight"]) {
element.css("color", "red");
}
}
});
myApp.filter("dayName", function () {
var dayNames = ["Sunday", "Monday", "Tuesday", "Wednesday",
"Thursday", "Friday", "Saturday"];
return function (input) {
return angular.isNumber(input) ? dayNames[input] : input;
};
});
myApp.service("days", function () { // 创建服务
this.today = new Date().getDay();
this.tomorrow = (this.today + 1)%7;
});
</script>
</head>
<body>
<div class="panel">
<div class="page-header">
<h3>AngularJS App</h3>
</div>
<h4 ng-controller="dayCtrl" highlight="Monday">
Today is {{day || "(unknown)" | dayName}}
</h4>
<h4 ng-controller="tomorrowCtrl">
Tomorrow is {{day || "(unknown)" | dayName}}
</h4>
</div>
</body>
</html>
2.2 Module.factory(name, provider)
2.3 Module.provider(name, type)
2.4 Module.value(name, value)
用于创建返回固定值和对象的服务, 这意味着可以为任何值或对象使用依赖注入, 而不仅仅是 module 方法创建的那些对象.
示例代码:
<script>
var myAPP = angular.module("exampleApp", [])
var now = new Date(); // 将 Date() 对象赋给自定义的 now 变量
myApp.value("nowValue", now) // 创建一个值服务
myApp.service("days", function(nowValue){ // 定义对 nowValue 服务的依赖.
this.today = nowValue.getDay();
this.tomorrow = this.today + 1;
});
</script>
AngularJS高级程序设计读书笔记 -- 服务篇的更多相关文章
- AngularJS高级程序设计读书笔记 -- 大纲篇
零. 初衷 现在 AngularJS 4 已经发布了, 楼主还停留在 1.x 的阶段, 深感自卑. 学习 AngularJS 的初衷是因为, 去年楼主开始尝试使用 Flask 开发自动化程序, 需要用 ...
- AngularJS高级程序设计读书笔记 -- 过滤器篇
一. 过滤器基础 过滤器用于在视图中格式化展现给用户的数据. 一旦定义过滤器之后, 就可在整个模块中全面应用, 也就意味着可以用来保证跨多个控制器和视图之间的数据展示的一致性. 过滤器将数据在被指令处 ...
- AngularJS高级程序设计读书笔记 -- 指令篇 之 内置指令
1. 内置指令(10-12 章) AngularJS 内置超过 50 个内置指令, 包括 数据绑定,表单验证,模板生成,时间处理 和 HTML 操作. 指令暴露了 AngularJS 的核心功能, 如 ...
- AngularJS高级程序设计读书笔记 -- 控制器篇
作用域组成了一个能够用于在控制器之间形成通信的体系结构. 1. 控制器和作用域的基本原理 控制器就像领域模型与视图之间的纽带, 他给视图提供数据与服务, 并且定义了所需的业务逻辑, 从而将用户行为转换 ...
- AngularJS高级程序设计读书笔记 -- 模块篇
一. 模块基础 1. 创建模块 <!DOCTYPE html> <html ng-app="exampleApp"> <head> <ti ...
- AngularJS高级程序设计读书笔记 -- 指令篇 之 自定义指令
2. 自定义指令(15-17 章) Module.directive(name, factory) 2.1 创建自定义指令的方法 Module.directive(name, factory) 示例 ...
- javascript高级程序设计读书笔记-事件(一)
读书笔记,写的很乱 事件处理程序 事件处理程序分为三种: 1.html事件2. DOM0级,3,DOM2级别 没有DOM1 同样的事件 DOM0会顶掉html事件 因为他们都是属性 而 ...
- javascript高级程序设计读书笔记
第2章 在html中使用javascript 一般都会把js引用文件放在</body>前面,而不是放在<head>里, 目的是最后读取js文件以提高网页载入速度. 引用js文 ...
- Javascript高级程序设计读书笔记(第六章)
第6章 面向对象的程序设计 6.2 创建对象 创建某个类的实例,必须使用new操作符调用构造函数会经历以下四个步骤: 创建一个新对象: 将构造函数的作用域赋给新对象: 执行构造函数中的代码: 返回新 ...
随机推荐
- 【算法系列学习】[kuangbin带你飞]专题十二 基础DP1 G - 免费馅饼
https://vjudge.net/contest/68966#problem/G 正解一: http://www.clanfei.com/2012/04/646.html #include< ...
- 蓝桥杯-等额本金-java
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...
- fileInput实战总结
fileinput组件实战总结 fileinput是一个增强的基于Bootstrap3.x和HTML5的文件上传工具,具备多种格式文件的预览功能, 另外,它包含了基于AJAX的上传,拖拽和撤销文件,可 ...
- mysql导入导出sql文件(包括数据库和数据表的操作)
废话不多说直接开始. 在windows命令行下登录mysql,创建一个test_01数据库,创建一个user表,并插入一条数据,如下 一.导出数据库test_01 1.退出数据库,在命令行中输入 my ...
- myeclipse的class文件编译设置
一,设置单个工程的class文件路径 右击工程,BulidPath——Configure Build Path
- 今天打补丁出问题了,害得我组长被扣了1k奖金。
今天是第三次给mxdw打补丁和打包,外加公司高管说有一个东西必须要今天之内搞定外放. 我当时问策划为什么这么着急?策划说大佬决定的(这种做事方式真的很不习惯).我等屁民加班加点的搞事情,把功能搞出去了 ...
- Java中Properties类
1 简介: JDK提供的java.util.Properties类继承自Hashtable类并且实现了Map接口,用map来存储key-value数据,所以存入的数据是无序的.其中键和值都是字符串类型 ...
- 【2017-05-05】timer控件、三级联动、帐号激活权限设置
一.Timer控件 Timer实际就是一个线程控件. 属性:Enabled 是否被启用 Interval 多长时间执行一次控件中的代码 事件: Tick 事件中放要执行的代码. ...
- DTCMS插件的制作实例电子资源管理(三)前台模板页编写
总目录 插件目录结构(一) Admin后台页面编写(二) 前台模板页编写(三) URL重写(四) 本实例旨在以一个实际的项目中的例子来介绍如何在dtcms中制作插件,本系列文章非入门教程,部分逻辑实现 ...
- SQL SERVER大话存储结构(2)_非聚集索引如何查找到行记录
如果转载,请注明博文来源: www.cnblogs.com/xinysu/ ,版权归 博客园 苏家小萝卜 所有.望各位支持! 1 行记录如何存储 这里引入两个 ...