<!DOCTYPE html>
  <html lang="en">
  <head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
  table{
  border-collapse: collapse;
  }
  td{
  padding: 10px;
  border: 1px solid #000;
  }
  </style>
  <script src="../angular-1.5.5/angular.min.js"></script>
  <script>
  var myapp=angular.module("myapp",[]);
  myapp.controller("myCtrl",function($scope){
  $scope.data=[{
  name:"张三",
  wz:"控球后卫",
  num:"11",
  ps:"999"
  },{
  name:"李四",
  wz:"大前锋",
  num:"21",
  ps:"888"
  },{
  name:"王五",
  wz:"小前锋",
  num:"23",
  ps:"777"
  },{
  name:"赵六",
  wz:"中锋",
  num:"10",
  ps:"666"
  },{
  name:"周七",
  wz:"得分后卫",
  num:"1",
  ps:"555"
  }];
  $scope.search="";
  $scope.search2="";
  $scope.$watch("search",function(value){
  console.log(value);
  if(value.indexOf("枪")!=-1){
  alert("包含敏感字");
  $scope.search="";
  }else{
  $scope.search2=$scope.search;
  }
  });
  //选择排序部分
  $scope.sort="--请选择--";
  //$scope.revers=null;
  $scope.fun=function(){
  if($scope.sort!="--请选择--"){
  if($scope.sort=="票数倒序"){
  $scope.revers=true;
  }else if($scope.sort=="票数正序"){
  $scope.revers=false;
  }
  }
  };
  //新增球员部分
  $scope.show=false;
  $scope.add=function(){
  $scope.show=true;
  };
  $scope.push=function(){
  for(var i=0;i<$scope.data.length;i++){
  if($scope.name==$scope.data[i].name){
  alert("重复");
  return;
  }
  }
  $scope.data.push({name:$scope.name,wz:$scope.wz,num:$scope.num,ps:$scope.ps});
  };
  console.log(angular.isNumber(0));
  })
  </script>
  </head>
  <body ng-app="myapp" ng-controller="myCtrl">
  <span>查询</span>
  <input type="text" ng-model="search">
  <span>排序</span>
  <select ng-model="sort" ng-change="fun()">
  <option>--请选择--</option>
  <option>票数倒序</option>
  <option>票数正序</option>
  </select><br/>
  <button ng-click="add()">新增球员</button>
  <table>
  <thead>
  <tr>
  <td>姓名</td>
  <td>位置</td>
  <td>球号</td>
  <td>票数</td>
  </tr>
  </thead>
  <tbody>
  <tr ng-repeat="item in data|filter:search2|orderBy:'ps':revers">
  <td>{{item.name}}</td>
  <td>{{item.wz}}</td>
  <td>{{item.num}}</td>
  <td>{{item.ps}}</td>
  </tr>
  </tbody>
  </table>
  <table ng-show="show">
  <tr>
  <td>姓名</td>
  <td><input type="text" ng-model="name"></td>
  </tr>
  <tr>
  <td>位置</td>
  <td><input type="text" ng-model="wz"></td>
  </tr>
  <tr>
  <td>球号</td>
  <td><input type="text" ng-model="num"></td>
  </tr>
  <tr>
  <td>票数</td>
  <td><input type="text" ng-model="ps"></td>
  </tr>
  <tr>
  <td colspan="2"><button ng-click="push()">添加</button></td>
  </tr>
  </table>
  </body>
 

</html>

.

.

..

...

.

.....

..

..

.

.

.

.

.

.

.

.

.

.

.

..

angular js 正序倒叙的更多相关文章

  1. js操作table倒叙显示序号的问题

    今天遇到一奇葩问题,就是在js添加table时,序号是倒叙显示的,而且数据库查出来时正序的,为什么显示是倒叙的呢? 我百度一番,终于有了结果: var newRow=table.insertRow(- ...

  2. js 正序、倒序、按字段排序方法

    js 基础--sort方法: arrayObject.sort(sortby); 参数:定义排序规则(正序.倒序.按字段排序)的函数: 返回值:对数组的引用.请注意,数组在原数组上进行排序,不生成副本 ...

  3. angularjs ng-repeat倒叙

    <div ng-app="myApp" ng-controller="customersCtrl"> <table> <tr ng ...

  4. 【java基础学习一】int[]、Integer[]、String[] 排序（ 正序、倒叙）、去重

    调用: //重复项有9.5.1.2 int[] ints = new int[]{9,4,7,8,2,5,1,6,2,5,9,1}; arrayIntTest(ints); ///////////// ...

  5. JS使用Enter事件将输入的字符倒叙输出

    在JavaScript中执行当用户按下Enter键位时将用户输入的字符倒叙输出! HTML代码: <body> <form id="form1" runat=&q ...

  6. JS通过sort(),和reverse()正序和倒序

    sort()正序   var array1 = [0,1,5,10,15]; array1.sort();//结果为:0,1,10,15,5   请注意,上面的代码没有按照数值的大小对数字进行排序,要 ...

  7. compare正序与逆序

    //list:在数据查询出来的Record集合 //juli:是需要比较的字段   //实现一个Comparator接口 //后面减去前面是正序   前面减去后面是倒叙 //我这里做的一个距离排序 R ...

  8. MVC、MVP、MVVM、Angular.js、Knockout.js、Backbone.js、React.js、Ember.js、Avalon.js、Vue.js 概念摘录

    注:文章内容都是摘录性文字,自己阅读的一些笔记,方便日后查看. MVC MVC(Model-View-Controller),M 是指业务模型,V 是指用户界面,C 则是控制器,使用 MVC 的目的是 ...

  9. (翻译)Angular.js为什么如此火呢？

    在本文中让我们来逐步发掘angular为什么如此火: Angular.js 是一个MV*(Model-View-Whatever,不管是MVC或者MVVM,统归MDV(model Drive View ...

随机推荐

  1. Fang Fang HDU - 5455 (思维题)

    Fang Fang says she wants to be remembered. I promise her. We define the sequence FF of strings. F0 = ...

  2. uva 540 (Team Queue UVA - 540)

    又是一道比较复杂的模拟题.题中有两种队列,一种是总队列,从前向后.其他的是各个团体的小队列,因为入队的人如果有队友的话,会优先进入团体队列. 所以我们先设置两个队列和一个map,设置map倒是可以不用 ...

  3. (蓝桥杯)第八届A组C/C++跳蚱蜢

    #include<iostream> #include<memory.h> #include<stack> #include<string> #incl ...

  4. 第五节：numpy之数组维度处理

  5. scp相关命令总结

    scp 跨机远程拷贝scp是secure copy的简写,用于在Linux下进行远程拷贝文件的命令,和它类似的命令有cp,不过cp只是在本机进行拷贝不能跨服务器,而且scp传输是加密的.当你服务器硬盘 ...

  6. noip模拟赛 括号序列

    题目描述LYK有一个括号序列,但这个序列不一定合法.一个合法的括号序列如下:()是合法的括号序列.若A是合法的括号序列,则(A)是合法的括号序列.若A和B分别是合法的括号序列,则AB是合法的括号序列. ...

  7. ZooKeeper可视化Web管理工具收集（待实践）

    原来ZooKeeper是有Web管理后台的.但是仅限于操作ZooKeeper的数据,如果要监控性能,估计要借助Nagios去配合. 这些工具应该ZK UI最好用,下面是收集的一些工具安装教程: htt ...

  8. loosejar原理简要分析

    loosejar这个小工具能够动态分析出应用中有每一个jar包的实际使用情况,详情请參阅<通过loosejar清理应用中冗余的jar包>基本原理是利用instrumentation的特性用 ...

  9. 【JavaScript】离开页面前提示

    离开页面前的提示不能够用onunload去做,由于它仅仅是兼容IE,你要兼容Google与FireFox就蛋疼了. 并且这个事件还是关闭之后才会触发的. 取而代之能够用onbeforeunload去实 ...

  10. vbs setkeys 特殊符号

    set keys={~}!^@^#^${%%}{^&^}{^^}{*}{(}{)}{_}{-}{=}{+}.;:'"