您的位置:首页 > Web前端 > JavaScript

angular.js学习笔记(二)

2017-02-17 17:36 429 查看

验证

ng-model 指令可以为应用数据提供状态值(invalid, dirty, touched, error)

<form ng-app="" name="myForm">
Email:
<input type="email" name="myAddress" ng-model="text">
<span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址</span>
</form>


试过了不在表单内的不起效。



scope

scope 是模型,一个 JavaScript 对象,带有属性和方法,这些属性和方法可以在视图和控制器中使用。

作用域

所有的应用都有一个 rootScope,它可以作用在ng−app指令包含的所有HTML元素中。rootScope 可作用于整个应用中。是各个 controller 中 scope 的桥梁。用 rootscope 定义的值,可以在各个 controller 中使用。

过滤器

currency 格式化数字为货币格式。

filter 从数组项中选择一个子集。

lowercase 格式化字符串为小写。

orderBy 根据某个表达式排列数组。

uppercase 格式化字符串为大写。

过滤器可以通过一个管道字符(|)和一个过滤器添加到表达式中。

<p>你输入的是 <span>{{name | uppercase}}</span></p>




<li ng-repeat="x in names | orderBy:'country'">
{{ x.name + ', ' + x.country }}
</li>


Service

$location 服务是作为一个参数传递到 controller 中。如果要使用它,需要在 controller 中定义

app.controller('customersCtrl', function($scope, $location) {
$scope.myUrl = $location.absUrl();
});


$http 是 AngularJS 应用中最常用的服务。 服务向服务器发送请求,应用响应服务器传送过来的数据。

app.controller('myCtrl', function($scope, $http) {
$http.get("welcome.htm").then(function (response) {
$scope.myWelcome = response.data;
});
});


$timeout 服务对应了 JS window.setTimeout 函数。

$interval 服务对应了 JS window.setInterval 函数

app.controller('myCtrl', function($scope, $timeout) {
$scope.myHeader = "Hello World!";
$timeout(function () {
$scope.myHeader = "How are you today?";
}, 2000);
});


你可以创建访问自定义服务,链接到你的模块中

app.service('myService', function() {
this.myFunc = function (x) {
return x.toString(16);
}
});
app.controller('myCtrl', function($scope, myService) {
$scope.hex = myService.myFunc(255);
});
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  angular