orderByExpression is back

Author: Stuart McGrigor

README.md

@@ -135,6 +135,7 @@ Attributes of angular treecontrol
     - `label` : inhject classes into the div element around the label
     - `labelSelected` : inject classes into the div element around the label only when the node is selected
 - `order-by` : value for ng-repeat to use for ordering sibling nodes
+- `order-by-expression` : an expression giving the value for ng-repeat to use for ordering sibling nodes
 - `reverse-order` : whether or not to reverse the ordering of sibling nodes based on the value of `order-by`
 - `filter-expression` : value for ng-repeat to use for filtering the sibling nodes
 - `filter-comparator` : value for ng-repeat to use for comparing nodes with the filter expression

angular-tree-control.js

@@ -38,6 +38,7 @@
                     menuId: "@",
                     options: "=?",
                     orderBy: "@",
+                    orderByExpression: "@?",
                     reverseOrder: "@",
                     filterExpression: "=?",
                     filterComparator: "=?"
@@ -256,7 +257,12 @@
                     };
 
                     //tree template
-                    var orderBy = $scope.orderBy ? ' | orderBy:orderBy:reverseOrder' : '';
+                    var orderBy = '';
+                    if ($scope.orderByExpression) {
+                        orderBy = ' | orderBy:' + $scope.orderByExpression + ':reverseOrder';
+                    } else if ($scope.orderBy) {
+                        orderBy = ' | orderBy:orderBy:reverseOrder';
+                    }
                     var rcLabel = $scope.onRightClick ? ' tree-right-click="rightClickNodeLabel(node)"' : '';
                     var ctxMenuId = $scope.menuId ? ' context-menu-id="'+ $scope.menuId+'"' : '';
 

index.html

@@ -943,7 +943,7 @@ <h1>Sorting tree nodes <small>(order-by, reverse-order)</small></h1>
             </div>
         </div>
         <div class="col-md-6">
-            <p>The <code>order-by</code> and <code>reverse-order</code> properties allows
+            <p>The <code>order-by</code>, <code>order-by-expression</code> and <code>reverse-order</code> properties allows
 	      controlling the sorting of the tree nodes.
                 The value of those attributes is used with the <code>ng-repeat</code> orderBy filter -
                 see more details at the <a href="https://code.angularjs.org/1.2.0-rc.3/docs/api/ng.filter:orderBy">Angular JS orderBy</a> docs.</p>

test/angular-tree-control-test.js

@@ -484,6 +484,30 @@ describe('treeControl', function() {
             expect(element.find('li:eq(2)').text()).toBe('a');
         });
 
+        it('should order sub-trees on different orders by expression', function() {
+            $rootScope.treedata = [
+                { subTreeSortOrder:"-label", label: "a", children: [ {label:"a2", children:[]}, {label:"a3", children:[]}, {label:"a1", children:[]} ] },
+                { subTreeSortOrder:"label",  label: "b", children: [ {label:"b2", children:[]}, {label:"b3", children:[]}, {label:"b1", children:[]} ] }
+            ];
+            element = $compile('<treecontrol tree-model="treedata" order-by-expression="node.subTreeSortOrder">{{node.label}}</treecontrol>')($rootScope);
+            $rootScope.$digest();
+            element.find('li:eq(1) .tree-branch-head').click();  // expand 'b' sub-tree
+            element.find('li:eq(0) .tree-branch-head').click();  // expand 'a' sub-tree
+            expect(element.find('li').length).toBe(8);
+
+            // 'A' sub-tree is ordered by descending label
+            expect(element.find('li:eq(0) div.tree-label:eq(0)').text()).toBe('a');
+            expect(element.find('li:eq(1)').text()).toBe('a3');
+            expect(element.find('li:eq(2)').text()).toBe('a2');
+            expect(element.find('li:eq(3)').text()).toBe('a1');
+
+            // 'B' sub-tree is ordered by ascending label
+            expect(element.find('li:eq(4) div.tree-label:eq(0)').text()).toBe('b');
+            expect(element.find('li:eq(5)').text()).toBe('b1');
+            expect(element.find('li:eq(6)').text()).toBe('b2');
+            expect(element.find('li:eq(7)').text()).toBe('b3');
+        });
+
         it('should be able to accept alternative children variable name', function () {
             $rootScope.treedata = createSubTree(2, 2);
             $rootScope.treedata.push({kinder: [{}]});