对使用 ng-repeat 的电子邮件 ID 应用自然排序

Question

我有一个从excel表导出的电子邮件列表，我想在输出中使用自然排序来显示它们。

在这方面谁能帮我吗。我想知道我在这里做错了什么。以及如何纠正。如果能找到一个有效的解决方案，我们将不胜感激。

基本上输出应该是排序的电子邮件

angular.module("myApp", ["naturalSort"]).
controller("myCtrl", ["$scope", function($scope) { 
    $scope.items = ["[e-mail]","[e-mail]","[e-mail]","number 3.com","[e-mail]" , "number [e-mail]", "[e-mail]" , "[e-mail]"
    ]
}]);
// Create a module for naturalSorting
angular.module("naturalSort", [])
// The core natural service
.factory("naturalService", ["$locale", function($locale) {
		// the cache prevents re-creating the values every time, at the expense of
		// storing the results forever. Not recommended for highly changing data
		// on long-term applications.
	var natCache = {},
		// amount of extra zeros to padd for sorting
        padding = function(value) {
			return '00000000000000000000'.slice(value.length);
		},
		
		// Calculate the default out-of-order date format (d/m/yyyy vs m/d/yyyy)
        natDateMonthFirst = $locale.DATETIME_FORMATS.shortDate.charAt(0) == 'm';
		// Replaces all suspected dates with a standardized yyyy-m-d, which is fixed below
        fixDates = function(value) {
			// first look for dd?-dd?-dddd, where "-" can be one of "-", "/", or "."
            return value.replace(/(dd?)[-/.](dd?)[-/.](d{4})/, function($0, $m, $d, $y) {
				// temporary holder for swapping below
                var t = $d;
				// if the month is not first, we'll swap month and day...
                if(!natDateMonthFirst) {
                    // ...but only if the day value is under 13.
                    if(Number($d) < 13) {
                        $d = $m;
                        $m = t;
                    }
                } else if(Number($m) > 12) {
					// Otherwise, we might still swap the values if the month value is currently over 12.
                    $d = $m;
                    $m = t;
                }
				// return a standardized format.
                return $y+'-'+$m+'-'+$d;
            });
        },
		
		// Fix numbers to be correctly padded
        fixNumbers = function(value) {
	 		// First, look for anything in the form of d.d or d.d.d...
            return value.replace(/(d+)((.d+)+)?/g, function ($0, integer, decimal, $3) {
				// If there's more than 2 sets of numbers...
                if (decimal !== $3) {
                    // treat as a series of integers, like versioning,
                    // rather than a decimal
                    return $0.replace(/(d+)/g, function ($d) {
                        return padding($d) + $d
                    });
                } else {
					// add a decimal if necessary to ensure decimal sorting
                    decimal = decimal || ".0";
                    return padding(integer) + integer + decimal + padding(decimal);
                }
            });
        },
		// Finally, this function puts it all together.
        natValue = function (value) {
            if(natCache[value]) {
                return natCache[value];
            }
            var newValue = fixNumbers(fixDates(value));
            return natCache[value] = newValue;
        };
	// The actual object used by this service
	return {
		naturalValue: natValue,
		naturalSort: function(a, b) {
			a = natVale(a);
			b = natValue(b);
			return (a < b) ? -1 : ((a > b) ? 1 : 0)
		}
	};
}])
// Attach a function to the rootScope so it can be accessed by "orderBy"
.run(["$rootScope", "naturalService", function($rootScope, naturalService) {
	$rootScope.natural = function (field) {
        return function (item) {
            return naturalService.naturalValue(item[field]);
        }
    };
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
    <ul>
        <li ng-repeat="item in items | orderBy:natural('item')">            
              {{ item }}
        </li>
    </ul>
</div>

Answer 1

这看起来像是大材小用。你有没有试过去掉naturalSort模块中的所有内容，只使用一个没有参数的orderBy？即：

<li ng-repeat="item in items | orderBy">{{item}}</li>

看看这个Plunkr。

按字母顺序对字符串排序是OrderBy指令默认行为的一部分。

Answer 2

同意Aron的观点，解决方案过于复杂。

但是，实际的问题是

return naturalService.naturalValue(item[field]);

这里，item指的是电子邮件，所以item[field]总是未定义的。这个未定义的值被传递给排序方法并导致异常。将以上行替换为：

return naturalService.naturalValue(item);

你的这类似乎很管用。