AngularJS:入门笔记

介绍

AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购。是一款优秀的前端JS框架,已经被用于Google的多款产品当中。AngularJS有着诸多特性,最为核心的是:MVVM、模块化、自动化双向数据绑定、语义化标签、依赖注入,等等。AngularJS百度百科

入门

可以使用下面这个应用开始AngularJS的第一步.

AngularJS
image-2248

一些常用的命令

ng-app 指令定义一个AngularJS应用程序[一个页面可包含多个]。

ng-model  指定把元素值(比如输入框的值)绑定到应用程序。

ng-bind  指令把应用程序数据绑定到HTML视图。

ng-init  指令初始化AngularJS应用程序变量[不推荐使用]。

{{}}  表达式.

把数据绑定到HTML与ng-bind指令相同.

ng-repeat  指令会重复一个HTML元素。

ng-controller  指令定义了应用程序控制器。控制器的 $scope 是控制器所指向的应用程序 HTML 元素。

 

过滤器:

过滤器描述
currency格式化数字为货币格式。[<p>总价 = {{ (quantity * price) | currency }}</p> ]
filter从数组项中选择一个子集。
lowercase格式化字符串为小写。/td>
orderBy根据某个表达式排列数组。
uppercase格式化字符串为大写。

$http  AngularJS 中的一个核心服务,用于读取远程服务器的数据。

ng-repeat 显示表格[下面有示例]

ng-disabled  指令直接绑定应用程序数据到HTML的disabled属性[true,false].

ng-show  指令隐藏或显示一个HTML元素.

ng-click  指令定义了一个单击事件

ng-hide =”true”元素不可见,=”false”元素可见.控制元素隐藏或显示.

一个Demo页面


页面中包含了几个示例,都是可以运行的.

第二个源文件,必须与index.html放在同一个目录下面.

第三个源文件,必须与index.html放在同一个目录下面.

快速入门教程

推荐W3cscholl.cc的AngularJS在线教程,以及angularjs.cn[AngularJS中文网]这两个网址,都有很不错的教程.

AngularJS有一些让人眼前一亮的特性,正因为这个,才能坚持学习!加油!!

发表评论

此站点使用Akismet来减少垃圾评论。了解我们如何处理您的评论数据