最後の行をNONソート可能にする

Question

私の角プロジェクトでソート可能なテーブル行がありますが、行のソートにもquery-uiコード要素が含まれていて、最後の行を並べ替えることはできません。

HTML

<div ng:controller="controller"> 
    <table style="width:auto;" class="table table-bordered"> 
     <thead> 
      <tr> 
       <th>Index</th> 
       <th>Count</th> 
      </tr> 
     </thead> 
     <tbody ui:sortable ng:model="list"> 
      <tr ng:repeat="item in list" class="item" style="cursor: move;"> 
       <td>{{$index}}</td> 
       <td>{{item}}</td> 
      </tr> 
      <tr> 
       <td>Non Sortable</td> 
       <td>Non Sortable</td> 
      </tr> 
     </tbody>{{list}} 
     <hr> 
</div> 

コントローラここ

var myapp = angular.module('myapp', ['ui']); 

myapp.controller('controller', function ($scope) { 
    $scope.list = ["one", "two", "thre", "four", "five", "six"]; 
}); 

angular.bootstrap(document, ['myapp']); 

はJsFiddleに取り組んでいる：http://jsfiddle.net/valor_/fc7oftkn/

最後の行は非ソート可能にするために、どのように？追加情報が必要な場合は、私に知らせてください。事前にありがとう

Answer 1

次のように<tfoot>に移動してください。

<table style="width:auto;" class="table table-bordered"> 
    <thead> 
    <tr> 
     <th>Index</th> 
     <th>Count</th> 
    </tr> 
    </thead> 
    <tbody ui:sortable ng:model="list"> 
    <tr ng:repeat="item in list" class="item" style="cursor: move;"> 
     <td>{{$index}}</td> 
     <td>{{item}}</td> 
    </tr> 

    </tbody>{{list}} 
    <tfoot> 
    <tr> 
     <td>Non Sortable</td> 
     <td>Non Sortable</td> 
    </tr> 
    </tfoot> 
</table>