角的js排序依據與數字字段不工作

在控制我寫了轉換等級爲浮動角的js排序依據與數字字段不工作

details.rank = ''; 
$scope.order = function (predicate) { 
    $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false; 
    if (predicate == 'rank') { 
     for (var i = 0; i < data.countries[$scope.index].cities.length; i++) { 
      details.rank = parseFloat(data.countries[$scope.index].cities[i].rank); 
     } 
     $scope.predicate = predicate; 
    } else $scope.predicate = predicate; 
};

但在這裏我得到錯誤的ReferenceError代碼：細節沒有被定義

我有JSON是這樣的：

{ 
    "countries": [{ 
     "country": "India", 
     "cities": [{ 
      "name": "Bangalore", 
      "rank": "40" 
     }, { 
      "name": "Kolkata", 
      "rank": "54" 
     }, { 
      "name": "Mumbai", 
      "rank": "32" 
     }, { 
      "name": "Chennai", 
      "rank": "42" 
     }] 
    }, { 
     "country": "China", 
     "cities": [{ 
      "name": "Guangzhou", 
      "rank": "111" 
     }, { 
      "name": "Beijing", 
      "rank": "90" 
     }, { 
      "name": "Fuzhou", 
      "rank": "21" 
     }, { 
      "name": "Baotou", 
      "rank": "23" 
     }] 
    }] 
}

在HTML如果我點擊選項卡的頭那麼它會對錶格進行升序和降序排序，但我無法做到這一點。

<ul ng-repeat="city in countryType"> 
    <li> 
     <div class="text" ng-click="orderListBy('name')"> Name </div> 
     <div class="text" ng-click="orderListBy('rank')"> Rank</div> 
     <div class="text" ng-click="orderListBy('population')"> Population </div> 
     <div class="text" ng-click="orderListBy('language')"> Language</div> 
    </li> 
    <li ng-repeat="details in city.data.cities | orderBy:predicate:reverse"> 
     <div class="text" id="t1-{{$index}}"> {{details.name}} </div> 
     <div class="text" id="t2-{{$index}}"> {{details.rank}}</div> 
     <div class="text" id="t3-{{$index}}"> {{details.population}} </div> 
     <div class="text" id="t4-{{$index}}"> {{details.language}}</div> 
    </li> 
</ul>

而在你的控制器

//initialize values 
$scope.predicate = 'rank'; 
$scope.reverse = false; 

$scope.orderListBy = function(attr){ 
    $scope.predicate = attr; 
    $scope.reverse = !$scope.reverse; 
};

否則，它會恢復排序時重：

<th> 
    <a href="" ng-click="order('rank')">RANK</a> 
    <span ng-show="predicate === 'rank'" ng-class="{reverse:reverse}">  </span> 
</th> 
<ul ng-repeat="city in countryType"> 
    <li ng-repeat="details in city.data.cities | orderBy:predicate:reverse"> 
     <div class="text" id="t1"> {{details.name}} </div> 
     <div class="text" id="t2"> {{details.rank}}</div> 
     <div class="text" id="t3"> {{details.population}} </div> 
     <div class="text" id="t4"> {{details.language}}</div> 
    </li> 
</ul>

來源

2015-06-11 Manoj Gupta

所有工作都很好，我只想將json文件中的rank字段轉換爲float或int值，以便我能夠排序。 –

'details'只能在ng-repeat範圍內退出，所以在控制器 –

中沒有'details'如果使用$ scope.details.name，那麼它也會給我錯誤，如** TypeError：無法設置屬性'等級'undefined ** –

您可以通過點擊標題的div做的那樣做一個動態排序點擊列的標題。

PS：不要忘記在ng-repeat指令中動態命名您的ID以避免錯誤並且有一個有效的HTML代碼。

來源

2015-06-11 08:20:41 Freezystem

角的js排序依據與數字字段不工作

回答

相關問題