AngularJS控制器和过滤器学习（三）

浏览数：101 / 时间：2015年06月09日

AngularJS控制器

AngularJS 控制器控制 AngularJS 应用程序的数据。
AngularJS 控制器是常规的JavaScript对象

<h2>AngularJS 控制器属性</h2>
<div ng-app="" ng-controller="MyController">
   <p>姓名：<input type="text" ng-model="person.name"></p>
    <p>性别： <input type="text" ng-model="person.sex"></p>
    <div>信息： {{person.info()}}  </div>

</div>
<script type="text/javascript">
    function MyController($scope){
        $scope.person = {
            name:"LanFeng",
            sex:"女",
            info:function(){
                var x;
                x = $scope.person;
                return x.name + " "+ x.sex;
            }
        }
    }
</script>
<h2>AngularJS 控制器方法</h2>
<div ng-app="" ng-controller="MyController">
    <p>姓名：<input type="text" ng-model="person.name"></p>
    <p>性别： <input type="text" ng-model="person.sex"></p>
    <div>信息： {{info()}}  </div>

</div>
<script type="text/javascript">
    function MyController($scope){
        $scope.person = {
            name:"LanFeng",
            sex:"女"

        };
        $scope.info=function(){
            var x;
            x = $scope.person;
            return x.name + " "+ x.sex;
        }
    }
</script>

AngularJS过滤器

currency 格式化数字为货币格式。
filter 从数组项中选择一个子集。
lowercase 格式化字符串为小写。
orderBy 根据某个表达式排列数组。
uppercase 格式化字符串为大写。

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


<h2>AngularJS 控制器方法</h2>
<div ng-app="" ng-controller="MyController">
    <p>姓名：<input type="text" ng-model="person.name"></p>
    <p>性别： <input type="text" ng-model="person.sex"></p>
    <div>信息： {{person.name | }}  </div>

</div>
<script type="text/javascript">
    function MyController($scope){
        $scope.person = {
            name:"LanFeng",
            sex:"女"

        }
    }
</script>