Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy
ng-app 定义作用域,从作用域处开始执行ng命令指令
ng-model 数据绑定字符,用于双向数据绑定
ng-controller ng控制台,定义function name($scope)来填充controller内容。
ng-repeat 循环读取{{i in $scope.xx}} or {{i in [0,1,2,3,4]}} or {{i in ["aa","bb","cc"]}}
|filter:modelName 绑定查询标签
filter:
ng-repeat="phone in phones |filter:query
绑定的name与当前ng-controller或ng-app一致,当在controller中定义时,
只能在controller内可以获取到值,相当于在方法体内定义变量和在ng-app下定义公共变量
orderBy:
ng-repeat="phone in phones |orderBy:orderPro
绑定的name与当前ng-controller或ng-app一致,当在controller中定义时,
只能在controller内可以获取到值,相当于在方法体内定义变量和在ng-app下定义公共变量
$scope
Q:ng-repeat 重复读取

<div ng-app>
Hello {{'World'}}! Your name:<input type="text" ng-model="yourname" placeholder="World" />
<hr />
Hello {{ yourname || 'World'}}! {{99*5}} <div ng-controller="PhoneListCtrl">
<ul>
<li ng-repeat="phone in phones">
<span>{{phone.name}}</span>
<p>
{{phone.snippet}}
</p>
</li>
</ul>
</div> <p>Total number of phones: 2</p>
</div>
<script type="text/javascript">
function PhoneListCtrl($scope) {
$scope.phones = [
{ "name": "Nokia", "snippet": "Most memory when we was young" },
{ "name": "Motorola", "snippet": "Hello MOTO" },
{ "name": "XiaoMi4", "snippet": "Made in China" }
];
}
</script>
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
A:ng版本原因,引用官方地址时出现此问题,引用本地其他版本时无此问题。
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
Angularjs 学习笔记-2017-02-05-初识Angular及app、model、controller、repeat指令和fileter、orderBy的更多相关文章
- 【AngularJS学习笔记】02 小杂烩及学习总结
表格示例 <div ng-app="myApp" ng-controller="customersCtrl"> <table> < ...
- AngularJs学习笔记--Understanding Angular Templates
原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angular template是一个声明规范,与mode ...
- AngularJs学习笔记--Forms
原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...
- AngularJs学习笔记--expression
原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...
- AngularJs学习笔记--directive
原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...
- AngularJs学习笔记--Guide教程系列文章索引
在很久很久以前,一位前辈向我推荐AngularJs.但当时我没有好好学习,仅仅是讲文档浏览了一次.后来觉醒了……于是下定决心好好理解这系列的文档,并意译出来(英文水平不足……不能说是翻译,有些实在是看 ...
- AngularJs学习笔记--bootstrap
AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...
- AngularJs学习笔记--html compiler
原文再续,书接上回...依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler 一.总括 Angular的HTML compiler允许开发者自 ...
- AngularJs学习笔记--concepts(概念)
原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...
- AngularJS学习笔记2——AngularJS的初始化
本文主要介绍AngularJS的自动初始化以及在必要的适合如何手动初始化. Angular <script> Tag 下面通过一小段代码来介绍推荐的自动初始化过程: <!doctyp ...
随机推荐
- valgrind简介以及在ARM上交叉编译运行【转】
转自:https://blog.csdn.net/dengcanjun6/article/details/54958359 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blo ...
- PEP 530 -- 异步推导式
PEP 530 -- 异步推导式 摘要 PEP 492和PEP 525使用async/await语法引入了协程.PEP 530建议添加list,set,dict推导式和生成器推导式的异步版本. 理论和 ...
- codeforces 38G - Queue splay伸展树
题目 https://codeforces.com/problemset/problem/38/G 题意: 一些人按顺序进入队列,每个人有两个属性,地位$A$和能力$C$ 每个人进入时都在队尾,并最多 ...
- PHPExcel导出数据时字段超过26列出错Invalid cell coordinate [1
http://blog.csdn.net/dl425134845/article/details/46650961 以下是解决方案函数 /** * 方法名: getExcel * 作用 ...
- 47)django-以put和delete方式提交数据
一:说明 同一个页面以ajax实现增删改查,对应方法post,delete,put,get, 其中delete和put方式提交的数据在request.body中需要序列化处理. 二:示例 #模板提交数 ...
- hadoop常用命令详细解释
hadoop命令分为2级,在linux命令行中输入hadoop,会提示输入规则 Usage: hadoop [--config confdir] COMMAND where COMMAND is on ...
- Confluence 6 配置数据库查询超时时间
如果数据库的查询时间太长同时你的应用程序显示没有响应,你可以配置数据库的查询超时时间.在默认情况下 Confluence 没有超时时间.希望配置数据库查询超时时间,在你的测试服务器上进行下面的操作: ...
- Confluence 6 理解你许可证的用户数
基于你的许可证类型,在你 Confluence 可以被注册的用户也许有限制. 在许可证明细页面中,将会告诉当前使用了多少的许可证(你注册的用户数量). 包括仅仅在 Confluence 中可以使用gl ...
- html table
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- Android 基础 十一 Android的消息机制
Handler是Android消息机制的上层接口,这使得在开发应用过程中我们只需要和Handler交互即可.Handler的使用过程很简单,通过它可以轻松地将一个任务切换到Handler所在的线程中去 ...