首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >漂浮的Angularjs orderBy

漂浮的Angularjs orderBy
EN

Stack Overflow用户
提问于 2016-01-26 06:20:19
回答 1查看 1.1K关注 0票数 0

联署材料:

代码语言:javascript
复制
(function(angular) {
  'use strict';
angular.module('orderByExample', [])
  .controller('ExampleController', ['$scope', function($scope) {
    $scope.friends =
        [{name:'John', phone:'2.5-3.3-7.5', age:10},
         {name:'Mary', phone:'10.5-3.7-9.1', age:19},
         {name:'Mike', phone:'10-21-30', age:21},
         {name:'Adam', phone:'11.1-5-10', age:35},
         {name:'Robert', phone:'1-3-7', age:27},
         {name:'Julie', phone:'9-15-20', age:29}];
    $scope.predicate = 'phone';
    $scope.reverse = true;
    $scope.order = function(predicate) {
      $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
      $scope.predicate = predicate;
    };
  }]);
})(window.angular);

HTML:

代码语言:javascript
复制
<table class="friend">
    <tr>        
     <th>
         <button ng-click="order('phone')">Phone Number</button>
         <span class="sortorder" ng-show="predicate === 'phone'" ng-class="{reverse:reverse}"></span>
     </th>         
    </tr>
    <tr ng-repeat="friend in friends | orderBy:predicate">
      <td>{{friend.name}}</td>
      <td>{{friend.phone}}</td>
      <td>{{friend.age}}</td>
    </tr>
  </table>

结果:

  • 1-3-7
  • 9-15-20
  • 10-21-30
  • 11.1-5-10
  • 2.5-3.3-7.5
  • 10.5-3.7-9.1

但我想要这个结果:

  • 1-3-7
  • 2.5-3.3-7.5
  • 9-15-20
  • 10-21-30
  • 10.5-3.7-9.1
  • 11.1-5-10

我只想根据phoneNumber进行排序。http://plnkr.co/edit/JI8bJ54C3ARurK5w1hFU?p=preview

EN

回答 1

Stack Overflow用户

发布于 2016-01-26 08:09:47

在您的示例中,您已经在映射phoneNumber并对其进行排序:

代码语言:javascript
复制
.map(function(friend) {
  // this removes all non-digits
  friend.phoneNumber = Number(friend.phone.replace(/[^\d]/g, ''));
  return friend;
})

如果您想保留phoneNumber,因为它只是map(),那么就使用parseFloat()

代码语言:javascript
复制
.map(function(friend) {
  // this will create a float from the first part until dash of friend.phone
  friend.phoneNumber = parseFloat(friend.phone);
  return friend;
})

普朗克

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35008025

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档