一.基本指令
1、ng-app=" " 指令初始化一个 AngularJS 应用程序,定义angularJS的使用范围;
tips:一个页面里创建多个 ng-app 手动加载即可:
var app1 = angular.module("app1", []); var app2 = angular.module("app2", []); angular.bootstrap(document.getElementById("app2"), ['app2']);
2、ng-init="变量=值;变量='值'" 初始化变量的值,有多个变量时,中间用分号隔开;
3、ng-model="变量"指令把元素值(比如输入域的值)绑定到应用程序;
验证用户输入:
ng-model
指令根据表单域的状态添加/移除以下类:
4、ng-bind="变量" 绑定变量名,获取该变量的数据。这里的变量就是第3条的变量名。但是一般都用双重花括号来获取变量的值,比如:{{变量}}。
5、ng-repeat 指令会重复一个 HTML 元素:
循环对象:
6.自定义指令:
限制使用:
restrict 值可以是以下几种:
E
作为元素名使用A
作为属性使用C
作为类名使用M
作为注释使用restrict 默认值为 EA
, 即可以通过元素名和属性名来调用指令。
二.AngularJS支持的数据
数字,字符串,数组,对象
与 JavaScript 表达式不同,AngularJS 表达式不支持条件判断,循环及异常。
AngularJS 表达式写在双大括号内:{{ expression }}。
AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙。
tips:
HTML5 允许扩展的(自制的)属性,以 data- 开头。
AngularJS 属性以 ng- 开头,但是您可以使用 data-ng- 来让网页对 HTML5 有效。
使用 ng-init 不是很常见。您将在控制器一章中学习到一个更好的初始化数据的方式。
三.AngularJS scope(作用域)
Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带。
Scope 是一个对象,有可用的方法和属性。
Scope 可应用在视图和控制器上。
四.AngularJS 控制器
五.AngularJS 过滤器:过滤器可以通过一个管道字符(|)和一个过滤器添加到表达式中。
currency:格式化数字为货币格式。
filter:从数组项中选择一个子集。
lowercase:格式化字符串为小写。
uppercase:格式化字符串为大写。
orderBy:根据某个表达式排列数组。
输入过滤:
六.AngularJS服务
在 AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用
$location.absUrl():返回当前页面的 URL 地址
$http: 服务向服务器发送请求,应用响应服务器传送过来的数据
$http.get('/someUrl', config).then(successCallback, errorCallback); $http.post('/someUrl', data, config).then(successCallback, errorCallback);
// 简单的 GET 请求,可以改为 POST $http({ method: 'GET', url: '/someUrl' }).then(function successCallback(response) { // 请求成功执行代码 }, function errorCallback(response) { // 请求失败执行代码 });
$timeout(function(){},2000) 服务对应了 JS window.setTimeout 函数
$interval(function(){},1000)服务对应了 JS window.setInterval 函数。
创建自定义服务:
255 的16进制是:
自定义服务,用于转换16进制数:
手机扫一扫
移动阅读更方便
你可能感兴趣的文章