AngularJS - 下拉列表中选择值不符合NG-重复订单 [英] AngularJS - Dropdown Select Values are not in Order with ng-repeat

问题描述

我有一个选择下拉与以下数据; （这也是输出到浏览器控制台）。

I have a select drop down with the following data; (This is also the output to the console in Chrome).

{
    8: "Something", 
    9: "Something Again!", 
    10: "And again", 
    11: "And again!", 
    12: "etc...", 
    13: "etc etc...", 
}

对于选择下拉HTML和角度;

The html and angular for the select drop down;

<select name="name" ng-model="choosen"> 
   <option value="">Please Select</select>
   <option ng-repeat="(key, value) in data" value="[[key]]">[[value]]</option>
</select>

的数据从使用内Laravel使用列表函数以下查询（4.2）得到;

The data is got from using the following query within Laravel (4.2) using the lists function;

Model::lists('name','id');

有关某些原因下拉被我降内重新排序下来的数据;

For some reason the data for the drop down gets reordered within my drop down to;

<select name="name" ng-model="choosen"> 
   <option value="">Please Select</select>
   <option value="10">And again</option>
   <option value="11">And again!</option>
   <option value="12">etc...</option>
   <option value="13">etc etc...</option>
   <option value="8">Something</option>
   <option value="9">Something Again!</option>
</select>

我如何从NG-重复运行通过数据的顺序输出正确的数字顺序？

How do i make the output from the ng-repeat run through the order of the data in the correct numerical order?

像这样;

<select name="name" ng-model="choosen"> 
   <option value="">Please Select</select>
   <option value="8">Something</option>
   <option value="9">Something Again!</option>
   <option value="10">And again</option>
   <option value="11">And again!</option>
   <option value="12">etc...</option>
   <option value="13">etc etc...</option>
</select>

Plunkr是这里

推荐答案

似乎ngRepeat由$$哈希对数据进行排序，这可能是解决方法是使用该列表中的键，然后在它们之间迭代函数：

Seems that ngRepeat order the data by the $$hash, probably the workaround is to use a function that list the keys and then iterate over them:

 $scope.keys = function(obj){
  return obj? Object.keys(obj) : [];
 }

http://plnkr.co/edit/S8BiSPy9axQobSZVwk3D?p=$p$ PVIEW

这篇关于AngularJS - 下拉列表中选择值不符合NG-重复订单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！