美文网首页
angularjs过滤器实例

angularjs过滤器实例

作者: Ting_Lee | 来源:发表于2017-07-04 13:05 被阅读0次

    <!doctype html>
    <html lang="en" ng-app="myApp">
    <head>
     <meta charset="UTF-8" />
     <title>Document</title>
    </head>
    <body>
     <div ng-controller="studentController">
      <div>
         显示条数: <input type="text" ng-model="num" /><br />
         名称:<input type="text" ng-model="username" /><br />
         任何查询 : <input type="text" ng-model="anySearch" />
        工资之上:<input type="text" ng-model="money" />
      </div>
      
      <div ng-repeat="item in studentlist | limitTo:num|orderBy:'-id' |filter:{'name':username} |filter:anySearch |filter:{'salary':money}:compareMoney">
       id:{{ item.id }} 名称:{{item.name}}  工资:{{item.salary}} 日期:{{item.birthday}}
      </div>
     </div>
    <script src="js/angular.min.js"></script> 
    <script type="text/javascript">
      var myApp = angular.module("myApp",[]);
      myApp.controller("studentController",function($scope,studentFactory){
       $scope.num=4;
       studentFactory.getStudentList($scope);
       $scope.compareMoney=function(a,b){
        return a>=b;
       }
      })
      
      myApp.factory("studentFactory",function($http){
       var factory={};
       factory.getStudentList=function(obj){
        $http.get("/student").then(function(data){
         obj.studentlist = data.data;
         console.log(data.data);
        }).catch(function(){
         console.log("error");
        });
       }
       return factory;
      })
      
    </script>
    </body>
    </html>

    相关文章

      网友评论

          本文标题:angularjs过滤器实例

          本文链接:https://www.haomeiwen.com/subject/ydathxtx.html