javascript - Angular 中的函数调用后表失去排序

Question

我有一个使用 Angular orderby 的表。我使用一个名为 tcoSort 的函数来进行计算，然后对表进行排序。问题是当我从行中的单选按钮调用 displayFullPricing() 时 - 表失去了排序。

<table class="table table-striped table-hover">
    <tr  ng-repeat="prices in productVariant.prices | orderBy: tcoSort">
    <td>£{{prices.monthly.retailPrice}}</td>
    <td>£{{prices.nonRecurring.retailPrice | number:0}}</td>
    <td><input type="radio" name="{{productVariant.code}}"  ng-click="displayFullPricing($index)"></td>
</tr>

$scope.tcoSort = function (productVariant) {
if(!$scope.isDisplayPrice){
    return  productVariant.nonRecurring.retailPrice + (productVariant.monthly.retailPrice * 36);
}
};


$scope.displayFullPricing = function (index) {

   $scope.isDisplayPrice = true; //This is to stop the table sort running more than once. 
I put this here to act as a flag as everytime this function was called from the radio button, tcoSort would fire again and sort the table. 
This meant that the radio button would only work once.

   //rest of code
}

我想问题是我正在创建标志来停止每次单击表中的单选按钮时发生的排序。但如果我不把它放在那里， $index 总是设置为顶部结果 - 所以它总是 0。

Answer 1

您应该只传递对象本身，而不是将相关项目的 $index 传递给 displayFullPricing 函数，例如

ng-click="displayFullPricing(prices)"

大概在//其余代码中的某个地方，您只是根据其索引选择相关项目？