controller 控制器
四、作用域:($rootScope)对整个页面相当于全局变量
也就是只要是用$rootScope定的东西它一定是作用于全局,而其它的只是对它控制器所在的那一部分
列如:
<body ng-app="app">
{{haha}} 这里是鸣人
<div ng-controller="ctrl">
{{name}} 小潘
{{age}} 200
{{haha}} 这里是鸣人
</div>
<div ng-controller="ctrl2">
{{name}} 小西
{{age}} 188
{{haha}} 这里便是鸣人
</div>
<script>
//定义 app模块
angular.module('app',[])
.controller('ctrl',function($scope,$rootScope){
$
scope.name="小潘!"
$scope.age = 200;
$rootScope.haha = '鸣人!';
})
//不同的写法,第二个参数是一个数组
.controller('ctrl2',["$scope",function($scope){
$
scope.name = '小西';
$scope.age = 188;
}])
</script>
</body>
</html>
五、$watch (观察看守的意思)
<body ng-controller="ctrl">
<h1>{{name}}</h1>
<input ng-model="name"/>
<script>
angular.module('app',[])
.controller('ctrl',function($scope,$timeout){
$scope.name = "鸣人!"
$scope.$watch(function(){
console.log($
scope.name)
})
setTimeout(function(){
//手动触发angular的脏检查
$scope.$apply(function(){ 请求传送
$scope.name = '小樱!'
})
},2000) 2000是设置时间2秒后
setTimeout(function(){
console.log('-------------')
$scope.name = '佐助!';
},2000);
以上蓝色部分是不会修改其上name的因为js代码里面是没办法对其更改的
$timeout(function () {
$scope.name = "卡卡西";
}, 4000);
})
</script>
</body>
第一次是鸣人
2秒后便是小樱
4秒后变为卡卡西
六、过滤器:
lowercase 格式化字符串为小写
uppercase 格式化字符串为大写
用法:注意中间管道符 |
<div ng-app="myApp" ng-controller="personCtrl">
<p>姓名为 {{ name | lowercase }}</p> 姓名为eee(转换为了小写)
</div>
angular.module('app',[])
.controller('myApp',function($scope,$timeout){
$scope.name = "EEE"
})
currency 过滤器(将数字格式化为货币格式)
<div ng-app="myApp" ng-controller="personCtrl">
<p>姓名为 {{ name | lowercase }}</p> 姓名为$123,456.00(转换为了小写)
</div>
angular.module('app',[])
.controller('myApp',function($scope,$timeout){
$scope.name = "123456" 数字
})
2、date 格式化
{{1490161945000 | date:"yyyy-MM-dd HH:mm:ss"}} // 2017-03-22 13:52:25
3、number 格式化(保留小数)
{{149016.1945000 | number:2}}