2016年4月5日

[TOC]

2016年4月5日

angularjs

• $scope.$apply()

function Aaa($scope){
    $scope.name = 'hello';
    setTimeout(function(){
        $scope.$apply(function(){
            $scope.name = 'hi';
        });
    },2000);

    //另一种写法
    //
    setTimeout(function(){
        $scope.name = 'BBR';
        $scope.$apply();        
    },2000);
}

这个方法监听数据有没有变化，当数据发生变化，就会影响视图。

• angular.module

  • controller //方法

  • run

    • 不引入控制器，挂载全局变量

var m1 = angular.module('myApp',[]);

m1.run(['$rootScope',function($rootScope){
    $rootScope.name = 'hello';
}]);

只能挂载全局作用域变量，不能调用局部变量。

• 过滤器/ currency

<script>

var m1 = angular.module('myApp',[]);

/*自定义过滤器*/
/*m1.filter('firstUpper',function(){
    return function(str,num){//通过return返回过滤后的结果
        //console.log(num);//传参
        return str.charAt(0).toUpperCase() + str.substring(1);
    }
});*/

m1.controller('Aaa',['$scope','$filter',function($scope,$filter){

    $scope.name = '723894734.7489545';
    //$scope.name = 'hello';
    //$scope.name = {"name":"hello","age":"20"};
    //$scope.name = ['a','b','c'];
    //$scope.name = '3748935795';

    /*$scope.name = [
        {color:"red",age:"20"},
        {color:"yellow",age:"30"},
        {color:"blue",age:"40"},
        {color:"green",age:"10"}
    ];*/

    //$scope.name = $filter('uppercase')('hello');
    //$scope.name = $filter('number')('236478234.3647348',1);//转数字，限制一位。
    // $scope.name = $filter('date')('2364782342');//Jan 28, 1970

    // $scope.name = 'hello';
    // 
    //$scope.name = $filter('firstUpper')('hello');


}]);



</script>
</head>

<div ng-controller="Aaa">

    <!-- 前面调价符号 -->
    <!-- <p>{{name | currency:"￥"}}</p> -->

    <!-- 保留一定长度的小数 -->
    <p>{{ name | number : 3}}</p>

    <!-- 全部大写 -->
    <!--<p>{{ name | uppercase }}</p>-->

    <!-- 以JSON格式展示数据 -->
    <!--<pre>{{ name | json }}</pre>-->

    <!-- 截取前两位 -->
    <!--<p>{{ name | limitTo : 2 }}</p>-->

    <!-- 日期展示格式 -->
    <!--<p>{{ name | date : 'yyyy' }}</p>-->

    <!-- 排序,或者倒序 -->
    <!--<p>{{ name | orderBy : 'age' : true }}</p>-->

    <!-- 过滤其他元素，只保留包含参数的字符串。 -->
    <!-- <p>{{ name | filter : 'l' }}</p> -->

    <!-- <p>{{ name | limitTo : 2 | uppercase }}</p> -->
    <!-- 截取一定长度数组或者字符串。 -->

    <!-- 自定义过滤器 -->
    <!--<p>{{ name | firstUpper : 2 }}</p>-->
    <!-- <p>{{ name }}</p> -->
</div>