<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> table{ border-collapse: collapse; width: 50%; height: 40%; margin: 0 auto; } th,td{ padding: 10px; border: 1px solid #000; } .blue{ background: blue; } </style> <script src="../angular-1.5.5/angular.min.js"></script> <script> var myapp = angular.module("myapp",[]); /* //过滤敏感字 myapp.filter("filter1",function () { return function (msg,flag) { return msg.replace(/我/,flag); } })*/ myapp.controller("myCtrl",function ($scope) { $scope.data = [ { "name":"张三", "position":"后卫", "num":"11", "vote":"999" }, { "name":"李四", "position":"前锋", "num":"21", "vote":"888" }, { "name":"王五", "position":"前锋", "num":"23", "vote":"777" }, { "name":"赵六", "position":"中锋", "num":"10", "vote":"666" }, { "name":"周期", "position":"后卫", "num":"1", "vote":"555" } ]; //添加成员,不能出现重复的球号 $scope.add = function () { for(var i = 0;i<$scope.data.length;i++){ if($scope.num==$scope.data[i].num){ alert("球号只能出现一次"); return; } } //非空判断 if($scope.name==""){ alert("请输入球员名称") return; } $scope.data.push({"name":$scope.name,"position":$scope.position,"num":$scope.num,"vote":$scope.vote}) } //排序 $scope.sort = "请选择" $scope.revers = true; $scope.fun = function () { if($scope.sort !="请选择"){ if($scope.sort!="票数正序"){ $scope.revers = true; }else if($scope.sort=="票数正序"){ $scope.revers = false; } } } //敏感字 $scope.search=""; $scope.search2 = ""; $scope.$watch("search",function (value) { console.log(value); if(value.indexOf("我")!=-1){ alert("包含敏感字"); $scope.search = ""; }else{ $scope.search2=$scope.search; } }); }) </script> </head> <body ng-app="myapp" ng-controller="myCtrl"> <input type="text" ng-model="search">查询 <select ng-model="sort" ng-change="fun()"> <option>请选择</option> <option>票数正序</option> <option>票数倒序</option> </select><br> <input type="text" ng-model="name">请输入姓名 <input type="text" ng-model="position">请输入位置 <input type="text" ng-model="num">请输入球号 <input type="text" ng-model="vote">请输入票数 <button ng-click="add()" style="background: blue">新增球员</button><br> <table> <thead> <tr> <th>姓名</th> <th>位置</th> <th>球号</th> <th>票数</th> </tr> </thead> <tbody> <tr ng-repeat="item in data|filter:{name:search2}|orderBy:'vote':revers"> <td>{{item.name}}</td> <td>{{item.position}}</td> <td>{{item.num}}</td> <td>{{item.vote}}</td> </tr> </tbody> </table> </body> </html>
过滤敏感字,排序等综合题
最新推荐文章于 2024-10-10 16:46:48 发布