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

标签 javascript angularjs sorting

我有一个使用 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。

最佳答案

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

ng-click="displayFullPricing(prices)"

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

关于javascript - Angular 中的函数调用后表失去排序,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29098802/

相关文章:

python - 在两个整数列表之间连续选择较大的数字

javascript - 在 php 中使用 Onsubmit 函数

javascript - Facebook 分享 PHP - 检查是否已分享

javascript - 在javascript中读取具有不同时区的日期字符串

AngularJS:带重定向的单元测试页面

Java流操作融合和有状态中间操作

c# - C# 中自顶向下归并排序的实现

javascript - ES6 类 'this' 用于非类方法

javascript - Angularjs通过forEach将对象加载到数组中

javascript - 如何在 ECMAScript 5 中拥有 block 作用域