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的更多相关文章

  1. 【AngularJS学习笔记】02 小杂烩及学习总结

    表格示例 <div ng-app="myApp" ng-controller="customersCtrl"> <table> < ...

  2. AngularJs学习笔记--Understanding Angular Templates

    原版地址:http://docs.angularjs.org/guide/dev_guide.mvc.understanding_model angular template是一个声明规范,与mode ...

  3. AngularJs学习笔记--Forms

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/forms 控件(input.select.textarea)是用户输入数据的一种方式.Form(表单) ...

  4. AngularJs学习笔记--expression

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/expression 表达式(Expressions)是类Javascript的代码片段,通常放置在绑定 ...

  5. AngularJs学习笔记--directive

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/directive Directive是教HTML玩一些新把戏的途径.在DOM编译期间,directiv ...

  6. AngularJs学习笔记--Guide教程系列文章索引

    在很久很久以前,一位前辈向我推荐AngularJs.但当时我没有好好学习,仅仅是讲文档浏览了一次.后来觉醒了……于是下定决心好好理解这系列的文档,并意译出来(英文水平不足……不能说是翻译,有些实在是看 ...

  7. AngularJs学习笔记--bootstrap

    AngularJs学习笔记系列第一篇,希望我可以坚持写下去.本文内容主要来自 http://docs.angularjs.org/guide/ 文档的内容,但也加入些许自己的理解与尝试结果. 一.总括 ...

  8. AngularJs学习笔记--html compiler

    原文再续,书接上回...依旧参考http://code.angularjs.org/1.0.2/docs/guide/compiler 一.总括 Angular的HTML compiler允许开发者自 ...

  9. AngularJs学习笔记--concepts(概念)

    原版地址:http://code.angularjs.org/1.0.2/docs/guide/concepts 继续.. 一.总括 本文主要是angular组件(components)的概览,并说明 ...

  10. AngularJS学习笔记2——AngularJS的初始化

    本文主要介绍AngularJS的自动初始化以及在必要的适合如何手动初始化. Angular <script> Tag 下面通过一小段代码来介绍推荐的自动初始化过程: <!doctyp ...

随机推荐

  1. python实战===教你用微信每天给女朋友说晚安【转】

    转自:https://www.cnblogs.com/botoo/p/8622379.html#4081184 但凡一件事,稍微有些重复.我就考虑怎么样用程序来实现它. 这里给各位程序员朋友分享如何每 ...

  2. ES6学习笔记三

    1.Symbol ES5 的对象属性名都是字符串,这容易造成属性名的冲突.如果有一种机制,保证每个属性的名字都是独一无二的就好了,这样就从根本上防止属性名的冲突.这就是 ES6 引入Symbol的原因 ...

  3. 使用cstdiofile在vs2010中无法写入中文的问题

    在VC2010环境下, 以下代码无法实现使用CStdioFile向文本文件中写入中文(用notepad.exe查看不到写入的中文) CStdioFile file; file.Open(…); fil ...

  4. 题解-UOJ284 快乐游戏鸡

    Problem uoj 题意大意: 一棵树,点权\(w_i\),每次玩家可以在树上行走,一条边需要\(1\)的时间,只能往儿子走.每次游戏需要从\(s\)到\(t\). 玩家有一个总死亡次数,初始为\ ...

  5. Jmeter之响应结果乱码解决

    场景: 在测试过程中,我们可能需要查看结果树,但是发现里面的响应数据在“Document”以外的其他表现形式下都有乱码,如下图就是设置了以Text的形式展示,响应数据包含乱码: 分析:原因是Jmete ...

  6. bootstrap 弹框

    <!DOCTYPE html> <html> <head> <meta name="viewport" content="wid ...

  7. 技术的热门度曲线:GHC

      全球最大的 IT 咨询公司高德纳(Gartner),有一个"技术热门度曲线"模型(Gartner Hype Cycle). 该模型认为,一门技术的发展要经历五个阶段. (1)启 ...

  8. Failed to execute goal org.apache.tomcat.maven:tomcat7-maven-plugin:2.2:deploy (default-cli) on project Resource: Cannot invoke Tomcat manager: Connection refused: connect -> [Help 1]

    1.问题描述 在 DOS 下执行 tomcat7-maven-plugin 插件部署,启动 Apache Tomcat 服务报错如下: D:\2018\code\XXX>mvn tomcat7: ...

  9. JavaScript从入门到精通(附光盘1张):作者:明日科技出版社:清华大学出版社出版时间:2012年09月

    本书介绍 一:本书 pdf 获取信息 本书下载:请申请加入本群 (QQ群:668345923),   并联系群主. 本群主有:本书pdf 全文教材 及附带的 光盘内容 二:本书目录介绍 第1篇  基 ...

  10. Confluence 6 管理协同编辑 - 代理和 SSL 的考虑

    对于你如何连接  Synchrony 是与你的环境有关的.我们知道绝大部分的 Confluence 站点是运行在反向代理后面的,同时还使用了 SSL.这里是帮助你在你环境中识别正确的配置的一些信息和一 ...