Angular smart-table st-sort not working correctly wrong order displayed

Question

I have a problem to sort my data with smart table, specifically when including a turkish character. Wrong order is generated.

In my controller:

$scope.rowCollection = [{
    a: 'Çanakkale',
    b: '3'
  }, {
    a: 'Ceyhan',
    b: '2'
  }, {
    a: 'ĞĞĞĞĞ',
    b: '4'
  }, {
    a: 'Ankara',
    b: '1'
  }, {
    a: 'Zonguldak',
    b: '5'
  }];

$scope.displayedCollection = [].concat($scope.rowCollection);

and my html:

<tr ng-repeat="row in displayedCollection">
  <td ng-repeat="col in columns">{{row[col]}}</td>
</tr>

Here's the plunk:

http://plnkr.co/edit/JW4G1n2QszIqYjcAmlNz

How can i fix it ?

Thanks for your help

Answer 1

This is what I've found for you:

1. The smart-table version in your plunk is missing some parts (line 164) which doesn't allow you to do what you want. I've changed it to version 2.1.8 in my plunk
2. Use st-set-sort="yourFilterName" on your table, where your st-table attribute is:
   

<table st-table="displayedCollection" st-set-sort="turkishFilter" st-safe-src="rowCollection" class="table table-striped">

3. Write a custom filter function:
   

angular.module('myApp', ['smart-table'])
.filter('turkishFilter', function(){
  return function(items, field, isDescending){
    
    //If you don't create a copy of the array, 
    //smart-table won't be able to restore the natural order state
    var result = items.slice();
    
    //Working only for string properties ATM!
    result.sort(function(first, second){
      //return first.a.localeCompare(second.a, 'tr');
      //OR
      return first[field].localeCompare(second[field], 'tr');
      
      //localCompare() is supported only in IE11 and upwards
    });
    
    if (isDescending){
      result.reverse();
    }
    
    return result;
    
  };
})

Working plunk HERE