angular(过滤查询)

来源:互联网 发布:nginx 配置两个server 编辑:程序博客网 时间:2024/05/16 17:01

这里写图片描述

<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <script type="text/javascript" src="js/angular.min.js"></script>    </head>    <body ng-app="myapp" ng-controller="mycrl">        <div class="div1">            <input type="text" ng-model="na" placeholder="用户名" ng-change="cha()" />        </div>        <table class="ta" border="1px" cellpadding="0px" cellspacing="0px">            <tr>                <th>姓名</th>            </tr>            <tr align="center" ng-repeat="u in users|filter:cx">                <td>{{u.name}}</td>            </tr>        </table>        <script type="text/javascript">            var mo = angular.module("myapp", []);            mo.controller("mycrl", function($scope) {                //准备原始的数组                   $scope.users = [{                    "name": "张三",                    "flag": false                },{                    "name": "温婉",                    "flag": false                },{                    "name": "胡桃",                    "flag": false                }];                //查询                $scope.cx = ""; //查询过滤赋值                $scope.cha = function() {                    if ($scope.na != "" && $scope.na != null) {}                    $scope.cx = {                        "name": $scope.na                    };                }            });        </script>    </body></html>
原创粉丝点击