标签：中文 enc 数字 过滤 sha data 字符串转换 doctype cas
AngularJS是一个JavaScript框架，它可以通过<script>标签添加到HTML页面。AngularJS通过指令拓展了HTML，且通过表达式绑定数据到HTML。
在AngularJS中module定义了应用程序，同时module是应用程序中不同部分的容器，Controll、Filter等在存在于module中。
module的创建
<div ng-app="myApp"></div>
<script>
var app = angular.module("myApp", [])
</script>
其中，在[...]内的内容为当前创建的module的依赖列表，如未依赖其他的模块，则方括号中不填写任何内容，但是不可以省略。如写为angular.module("myApp")则为引入模块而非创建新的模块。
Controller在<div>中由ng-controller指令定义，一般情况下，使用控制器主要是为了
scope对象scope对象添加行为(方法)controller创建实例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://code.angularjs.org/1.2.25/angular.min.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
{{value}}
</div>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.value = "this is a value";
});
</script>
</body>
</html>
其中，ng-app为定义AngularJS应用程序，应用程序在div中运行；
ng-controller是AngularJS中指令，用于定义控制器；
myCtrl是一个JavaScript函数；
$scope在此处表示控制器的作用域。
如何在控制器中创建方法？
<div ng-app="myApp" ng-controller="myCtrl">
<p>{{date()}}</p>
</div>
<script>
var app = angular.module("myApp", []);
app.controller("myCtrl", function ($scope) {
$scope.date = function () {
return new Date();
}
});
</script>
从处功能为将当下时间返回。其中，在使用$scope时需要先将其注入，否则会报错ReferenceError: $scope is not defined。
AngularJS过滤器可以用来格式化数据，能够使用管道符(|)添加到表达式和指令中。
常用内置Filter
向指令添加Filter
<li ng-repeat="x in names | orderBy:‘country‘">
{{ x.name + ‘, ‘ + x.country }}
</li>
向表达式添加Filter
<p>{{ value | lowercase }}</p>
添加自定义Filter
<div ng-repeat="u in myArr | filter:myFilter ">
<p>Name:{{u.name}}</p>
<p>Age:{{u.age}}</p>
</div>
// 先在Controller中定义function: myFilter
$scope.myFilter = function (item) {
return item.age > 20;
};
添加自定义Filter内容来源于无上@诀博客AngularJS的Filter用法详解一文。
指令是添加在HTML元素上的自定义标记（如：属性,元素,或css类）。
常见指令
ng-app 指令初始化一个AngularJS应用程序ng-init 指令初始化应用程序数据ng-model 指令把元素值绑定到应用程序ng-repeat 指令会循环一个HTML元素ng-style 指令添加前端样式在AngularJS中服务是一个函数或者对象，可以在AngularJS应用中使用，包括AngularJS的内建服务和自定义服务。
内建服务
$location
// 获取当前的URL地址
$scope.myUrl = $location.absUrl();
$http 向服务器发送请求，应用相应服务器传送过来的数据
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope, $http){
$http.get("xxx.html").then(function(response){
$scope.myXXX = response.data;
});
});
$interval对应JavaScript中windows.setInterval函数
// 每一秒刷新显示信息,显示时钟
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope, $interval){
$scope.theTime = new Date().toLocaleTimeString();
$interval(function(){
$scope.theTime = new Date().toLocaleTimeString();
}, 1000);
});
$timeout对应JavaScript中windows.setTimeout函数
// 两秒后显示信息
var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope, $timeout){
$scope.myHeader = "Hello World!";
$timeout(function () {
$scope.myHeader = "How are you today?";
}, 2000);
});
自定义服务 创建方法
var app = angular.module("myApp", []);
app.service("myService", function(){
this.myFun = function(string){
return "hello" + string;
}
});
调用自定义服务
var app2 = angular.module("myApp", []);
app2.controller("myCtrl", ["$scope" , "myService", function($scope, myService){
$scope.hello = myService.myFun("wang");
}]);
注意：此处controller引入依赖的顺序必须和function参数列表中顺序对应，否则会导致报错XXX is not a function。
[3] 博客园 无上@诀 博文“AngularJS的Filter用法详解”。
标签：中文 enc 数字 过滤 sha data 字符串转换 doctype cas
原文地址：https://www.cnblogs.com/otblog/p/11182347.html
