AngularJS 笔记系列(四)控制器和表达式
控制器:在 Angular 中控制器是一个函数,用来向作用域中添加额外的功能。我们用它来给作用域对象设置初始状态,并添加自定义行为。
使用方法: var app = angualr.module('app',[]);
app.controller('testController',function($scope){
// do sth here
})
控制器的嵌套:在整个应用中都会有父级作用域存在,除了孤立作用域以外,所有作用域都通过原型继承而来。他们都可以访问父级作用域。
默认情况下,当 AngularJS 在当前作用域无法找到某个属性时,就会向上寻找,一直追溯到$rootScope,如果最终没有找到,程序会继续运行,但是视图无法更新。
最佳实践:短小精悍,不应在 controller 中过多的操作 DOM 和 数据。复杂的业务逻辑应该放到服务和视图中去。
表达式:在 Angular 中,我们通过{{}}向$scope 上绑定变量的写法本质上就是表达式。当用$watch 进行监听时,Angular 就会对函数或表达式进行运算。
解析表达式:Angular 通过$parse 这个内部服务来解析表达式,$interpolate 服务返回一个函数,用以在特定的上下文中运算表达式。
<div ng-controller="MyController">
<input ng-model="to"
type="email"
placeholder="Recipient" />
<textarea ng-model="emailBody"></textarea>
<pre>{{ previewText }}</pre>
</div>
angular.module('myApp', [])
.controller('MyController', function($scope, $interpolate) {
//
$scope.$watch('emailBody', function(body) {
if (body) {
var template = $interpolate(body);
$scope.previewText =
template({to: $scope.to});
}
}; });
AngularJS 笔记系列(四)控制器和表达式的更多相关文章
- Java基础复习笔记系列 四 数组
Java基础复习笔记系列之 数组 1.数组初步介绍? Java中的数组是引用类型,不可以直接分配在栈上.不同于C(在Java中,除了基础数据类型外,所有的类型都是引用类型.) Java中的数组在申明时 ...
- 《ASP.NET Core In Action》读书笔记系列四 创建ASP.NET Core 应用步骤及相应CLI命令
一般情况下,我们都是从一个模板(template)开始创建应用的(模板:提供构建应用程序所需的基本代码).本节使用 Visual Studio 2017 .ASP.NET Core2.0和 Visua ...
- AngularJS 笔记系列(三)模块和作用域
模块: 在 AngularJS 中,将函数代码全部都定义在全局命名空间中绝对不是什么好主意,全局变量污染会使冲突几率变大,调试困难,降低开发效率.上次写计时器的 controller 时,我们把 co ...
- AngularJS笔记---作用域和控制器
什么是作用域. 什么是控制器, 作用域包含了渲染视图时所需的功能和数据,它是所有视图的唯一源头.可以将作用域理解成试图模型(ViewModel). 作用域之间可以是包含关系也可以是独立关系.可以通过设 ...
- Python基础笔记系列四:工具的安装与配置
本系列教程供个人学习笔记使用,如果您要浏览可能需要其它编程语言基础(如C语言),why?因为我写得烂啊,只有我自己看得懂!! 一开始是没有打算写工具这篇的,后来发现在某些情况下会遇到一些奇怪的问题,这 ...
- Windows-universal-samples学习笔记系列四:Data
Data Blobs Compression Content indexer Form validation (HTML) IndexedDB Logging Serializing and dese ...
- LeetCode 笔记系列四 Remove Nth Node From End of List
题目:Given a linked list, remove the nth node from the end of list and return its head.For example, Gi ...
- AngularJS 笔记系列(五)过滤器 filter
过滤器是用来格式化给用户展示的数据的. 在 HTML 中的模板绑定符号{{}} 内通过|符号来调用过滤器. 大写:{{ name | uppercase }} 也可以在 JS 中进行调用$filter ...
- Python基础笔记系列一:基本工具与表达式
本系列教程供个人学习笔记使用,如果您要浏览可能需要其它编程语言基础(如C语言),why?因为我写得烂啊,只有我自己看得懂!! 工具基础(Windows系统下)传送门:Python基础笔记系列四:工具的 ...
随机推荐
- imx6 android SD卡启动
工作中需要将imx6的android系统从SD卡启动,所以就分析了MfgTool中的脚本,分析android的分区情况,并尝试自己操作,竟然成功了,记录于此. 参考文档 http://www.kanc ...
- Sublime 插件补充
开启vim模式+autosave+Livereload插件 安装参考:emmmet http://www.cnblogs.com/wuheng1991/p/6144955.html
- servlet和jsp中间的交互
jsp本质上也是一个servlet, 所有的jsp页面最终会编译成一个servlet 1. jsp访问servlet jsp访问servlet比较简单通过get, post的方式直接访问servlet ...
- word excel文件 存入数据库 实战
上传: private void Insert2017(HttpContext context) { if (context.Request.Files["fileword"].C ...
- POJ 3468 A Simple Problem with Integers(线段树功能:区间加减区间求和)
题目链接:http://poj.org/problem?id=3468 A Simple Problem with Integers Time Limit: 5000MS Memory Limit ...
- vue向路由组件传递props
父子间的组件通讯是通过props和$emit来实现的,那么路由之间的通讯呢,往下看: 我现在再webpack里面有一个这样的结构, 我现在想test1里面的按钮点击跳转到test2里面,获得到test ...
- Perfmon - Windows 自带系统监测工具
本文转载自oscar999 一. 简述 可以用于监视CPU使用率.内存使用率.硬盘读写速度.网络速度等. Perfmon提供了图表化的系统性能实时监视器.性能日志和警报管理,系统的性能日志可定义为二进 ...
- std__vector介绍
vector是C++标准模板库中的部分内容,它是一个多功能的,能够操作多种数据结构和算法的模板类和函数库.vector之所以被认为是一个容器,是因为它能够像容器一样存放各种类型的对象,简单地说,vec ...
- 【BZOJ4598】[Sdoi2016]模式字符串 树分治+hash
[BZOJ4598][Sdoi2016]模式字符串 Description 给出n个结点的树结构T,其中每一个结点上有一个字符,这里我们所说的字符只考虑大写字母A到Z,再给出长度为m的模式串s,其中每 ...
- Android FragmentActivity 给Fragment传值
1.Fragment给Activity传值 定义一个在fragment 中 定义interface 监听器,让activity实现,并将activity的引用传递给fragment.即setListe ...