Numerical Sort

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
<div ng-controller="MainController">
    <!-- path로 정렬 -->
    <div ng-repeat="item in list | orderBy:'path'">
         {{item._id}} | {{item.definition}} | {{item.behavior}} | {{item.reward}} | {{item.path}}
    </div>
</div>

CSS

div {
    color: blue;
    text-decoration: underline;
}

JavaScript

var app = angular.module('myApp', []);

app.controller('MainController', function($scope) {
    
    $scope.data = [
        {_id: "1", definition: "건강", behavior: "잘자기, 잘먹기", reward: "건강"}, 
        {_id: "1.1", definition: "운동", behavior: "정기적인 운동", reward: "활력"}, 
        {_id: "10", definition: "사랑", behavior: "사랑하기", reward: "행복"}, 
        {_id: "10.1", definition:"사람", behavior: "사람을 사랑하기", reward: "기쁨"},
        {_id: "10.1.1", definition:"아름다운 사람", behavior: "아름다운 사람을 사랑하기", reward: "즐거움"},
        {_id: "2", definition: "생활", behavior: "행복하게 살기", reward: "행복"}, 
        {_id: "2.1", definition:"바이플레인", behavior: "멋지게 살기", reward: "행복"}
    ];

	  // $scope.lpad('java', '0', 8); : 0000java
	  $scope.lpad = function (s, c, n) {    
	      if (! s || ! c || s.length >= n) {
			      return s;
		    }
	
		    var max = (n - s.length)/c.length;
		    for (var i = 0; i < max; i++) {
			      s = c + s;
		    }
	
		    return s;
	  };

    $scope.list = [];
    
    for (var i = 0; i < $scope.data.length; i++) {
        // _id를 "." 기준으로 나눔
        var idcount = $scope.data[i]._id.split('.');
        var path = '';
        // 나눈 항목들의 앞을 0으로 채우고 (5자리가 될때까지) 사이에 "_"를 붙임
				for (var j = 0; j < idcount.length; j++) {
				    path = path + "_" + $scope.lpad(idcount[j], '0', 5);
				}
        // 제일 앞 "_" 지우기
        path = path.slice(1);
        // 기존 배열에 path (key) 와 path (value) 추가
        $scope.list.push($scope.data[i]);
        $scope.list[i].path = path;
    };
   
});