angular 过滤器的经典用法（排序，搜素）

最新推荐文章于 2020-06-23 17:04:14 发布

luben_jack

最新推荐文章于 2020-06-23 17:04:14 发布

阅读量225

点赞数

本文链接：https://blog.csdn.net/luben_jack/article/details/78291330

版权

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body ng-app="myApp">
<div ng-controller="costCtrl">
    搜索:<input ng-model="query">
    类型:
    <select ng-model="order">
            <option value="name">name</option>
            <option value="age">age</option>
    </select>
<ul>
    <li ng-repeat="n in list | filter:query | orderBy:order">
        {{n.name}}

        {{n.age}}


    </li>
</ul>
</div>

<script src="libs/angular.js"></script>
<script>
    (function () {
        var app=angular.module("myApp",[]);
        app.controller("costCtrl",function ($scope) {
            $scope.list= [
                {"name":"xingoo","age":25},
                {"name":"zhangsan","age":18},
                {"name":"lisi","age":20},
                {"name":"wangwu","age":30}
            ];
           $scope.order = "age";
        })
    })()

</script>
</body>
</html>