AngularJS order by not working with html value

I have a problem regarding angularjs orderby when the field is html value.

Here is my Code:

<tr data-ng-repeat="data in competencyReport | orderBy:sortOrder:reverse">
  <td style="border-right:none"><span data-ng-bind-html="data.competencyDescription |rawHtml"></span></td>
  <td style="border-right:none;border-left:none;width:100px">{{data.grade}}</td>
  <td style="border-right:none;border-left:none;width:100px">{{data.averageScore}}</td>
  <td style="border-right:none;border-left:none;width:30px">{{data.percentage.toFixed(2)}}</td>
  <td style="border-left:none;width:200px">
    <div class="progress">
        <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="{{data.percentage.toFixed(2)}}" aria-valuemin="0" aria-valuemax="100" data-ng-style="showProgress(data.percentage)">
            <span class="sr-only">{{data.percentage.toFixed(2)}} % Complete (success)</span>
        </div>
    </div>
  </td>
</tr>

This is the problem

<td style="border-right:none"><span data-ng-bind-html="data.competencyDescription |rawHtml"></span></td>

data.compentencyDescription is a HTML value

All other field can be sort ascending and descending but only competencyDescription field is not.

Why is it happened and how to sort this one ascending and descending?


Source: html5

Leave a Reply