angular控制器、服务和指令三者之间的关系
从总体来看,这三个组件的关系如下所示:
- 服务负责从远端服务器抓取和存储数据。
- 基于服务构建的控制器将为angular的作用域层次提供数据和功能。
- 基于服务和控制器构建的指令将直接与文档对象模型(DOM)元素进行交互。
<div ng-controller="MyController"></div>
var m = angular.module('myModule'); m.factory('myService', function() {
return { answer: 42 };
}); m.controller('MyController', function(myService) {
//使用myService
}); m.controller('MyController2', function(MyController) {
//错误:使用控制器注册
}); m.factory('myService2', function(MyController) {
//错误:使用控制器注册
});
每个ng-controller都会实例化一次,而服务只会实例化一次,即服务是单例的。
m.factory('myService', function($scope) {
//错误:$scope未使用依赖注入器进行注册
});
这就是为什么在angular中是控制器把javaScript数据和函数公开给HTMl而不是服务的原因:控制器可以访问$scope。
指令可以有一个相关联的控制器,可以把服务列为依赖。但是控制器和服务无法将指令列为依赖。
angular.module('stockDogApp')
.directive('stockTable', function() {
return {
template: 'Views/templates/stock-table.html',
restrict: 'E',
scope: {
watchlist: '='
},
controller: function ($scope) {
//...
}
}
});
指令还可以有一个require属性,用于保证指令的作用域必须总是另一指令作用域的子孙。
angular.module('stockDogApp')
.directive('stockRow', function($timeout, QuoteService) {
return {
restrict: 'A',
require: '^stockTable' //stockTable指令,^表示在父作用域中寻找
scope: {
stock: '=',
isLast: '='
},
link: function ($scope, $element, $attrs, stockTableCtrl) {
//..
}
}
});
指令选项require要求stockRow指令的作用域必须是stockTable指令的作用域的子孙,而且可以访问被实例化的stockTable指令的控制器,它是link函数的第4个参数。如果两个指令需要一起使用,那么require指令选项是完成这个工作的正确工具。
angular控制器、服务和指令三者之间的关系的更多相关文章
- 转:spring data jpa、 hibernate、 jpa 三者之间的关系
原文链接:spring data jpa. hibernate. jpa 三者之间的关系 spring data jpa hibernate jpa 三者之间的关系 JPA规范与ORM框架之间的关系是 ...
- 电脑结构和CPU、内存、硬盘三者之间的关系
前面提到了,电脑之父——冯·诺伊曼提出了计算机的五大部件:输入设备.输出设备.存储器.运算器和控制器. 我们看一下现在我们电脑的: 键盘鼠标.显示器.机箱.音响等等. 这里显示器为比较老的CRT显示器 ...
- 网络互联技术(2)——前篇—【转载】电脑结构和CPU、内存、硬盘三者之间的关系
原文链接:传送门 详细内容: 电脑结构和CPU.内存.硬盘三者之间的关系 前面提到了,电脑之父——冯·诺伊曼提出了计算机的五大部件:输入设备.输出设备.存储器.运算器和控制器. 我们看一下现在我们电脑 ...
- JDK,JRE,JVM三者之间的关系和作用
1,定义: JDK: Java Develpment Kit java 开发工具 bin:最主要的是编译器(javac.exe) include:java和JVM交互用的头文件 lib:类库 JRE: ...
- silverlight Canvas、StackPanel、Grid三者之间的关系
学习 silverlight 首先Canvas.StackPanel.Grid 博客园里看到jailu的这篇文章整理得很好 贴下来: Silverlight提供了非常灵活的布局管理系统,让程序员和 ...
- 【Linux网络编程】TCP网络编程中connect()、listen()和accept()三者之间的关系
[Linux网络编程]TCP网络编程中connect().listen()和accept()三者之间的关系 基于 TCP 的网络编程开发分为服务器端和客户端两部分,常见的核心步骤和流程如下: conn ...
- 程序中try、throw、catch三者之间的关系
c++程序中,采用一种专门的结构化处理逻辑的异常处理机制. 1.try语句 try语句块的作用是启动异常处理机制,检测try语句块中程序语句执行时可能出现的异常. try语句块总是与catch一同出现 ...
- Window系统、主函数和窗体函数这三者之间的关系
理解Window系统.主窗体.窗体函数这三者之间的关系,对于编写Windows程序十分重要. 主函数和窗体函数都是由Windows系统来调用的函数.仅仅只是主函数是程序启动之后.系统首先调用的函数: ...
- 5.Javascript 原型链之原型对象、实例和构造函数三者之间的关系
前言:用了这么久js,对于它的原型链一直有种模糊的不确切感,很不爽,隧解析之. 本文主要解决的问题有以下三个: (1)constructor 和 prototype 以及实例之间啥关系? (2)pro ...
随机推荐
- docker应用笔记
first install it: 首先安装: apt install docker.io 基本概念: 镜像:相当于虚拟机里的磁盘文件,里面有一套配置好的系统,应用程序 容器:相当于一个虚拟机实例,一 ...
- java 线程一
java基础学习总结--线程(一) 一.线程的基本概念 线程理解:线程是一个程序里面不同的执行路径 每一个分支都叫做一个线程,main()叫做主分支,也叫主线程. 程只是一个静态的概念,机器上的一个. ...
- 如何实现跨 Docker 主机存储?- 每天5分钟玩转 Docker 容器技术(73)
从业务数据的角度看,容器可以分为两类:无状态(stateless)容器和有状态(stateful)容器. 无状态是指容器在运行过程中不需要保存数据,每次访问的结果不依赖上一次访问,比如提供静态页面的 ...
- ionic2+Angular2:套接口明细步骤,以登录功能为例
1.在app.module.ts引用HttpModul,并在imports内引用.截图如下: 2.在src目录下新建http服务.命令行:ionic g provider HttpService ...
- hdu4704 Sum 2013 Multi-University Training Contest 10 数论题
Sum Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 131072/131072 K (Java/Others) Total Subm ...
- Next Greater Element I
You are given two arrays (without duplicates) nums1 and nums2 where nums1's elements are subset of n ...
- day01:study HTTP协议
总结: 1.对web客户端和web服务器之间的通讯有了基本原理有了简单理解. 2.对http协议有了相关概念的建立 3.B/S C/S 两种形式 4.搭建tomcat服务器的环境,相关配置(虚拟目录 ...
- Python实战之Selenium自动化测试web登录(2)
#!/usr/bin/env python3 # -*- coding:utf-8 -*- from selenium import webdriver from selenium.webdriver ...
- 第五章 MySQL事务,视图,索引,备份和恢复
第五章 MySQL事务,视图,索引,备份和恢复 一.事务 1.什么是事务 事务是一种机制,一个操作序列,它包含了一组数据库操作命令,并且把所有的命令作为一个整体一起向系统提交或撤销操作请求.要么都执行 ...
- Spring3实战第二章第一小节 Spring bean的初始化和销毁三种方式及优先级
Spring bean的初始化和销毁有三种方式 通过实现 InitializingBean/DisposableBean 接口来定制初始化之后/销毁之前的操作方法: 优先级第二通过 <bean& ...