Angularjs 使用ng repeat迭代对象属性，并使用ng 1.3按值而不是键排序_Angularjs_Angularjs Ng Repeat

Angularjs 使用ng repeat迭代对象属性，并使用ng 1.3按值而不是键排序

angularjs

Angularjs 使用ng repeat迭代对象属性，并使用ng 1.3按值而不是键排序,angularjs,angularjs-ng-repeat,Angularjs,Angularjs Ng Repeat,我指的是angular aboutngRepeat和迭代对象属性，其中说明： <div ng-repeat="(key, value) in myObj"> ... </div> 并希望它按值（即0&1）而不是键排序。如何通过角度测量实现这一点？（顺便说一下，我使用的是角度1.3）我试过： ng-repeat="(key, value) in myObj | orderBy:value" 但它不起作用有人能帮忙吗？就像使用过滤器一样，orderBy仅适用于阵列。一

我指的是angular about

ngRepeat

和迭代对象属性，其中说明：

<div ng-repeat="(key, value) in myObj"> ... </div>

并希望它按值（即

）而不是键排序。如何通过角度测量实现这一点？（顺便说一下，我使用的是角度1.3）

我试过：

ng-repeat="(key, value) in myObj | orderBy:value"

但它不起作用

有人能帮忙吗？

就像使用过滤器一样，orderBy仅适用于阵列。一个简单的解决方案是使用从对象返回数组的函数：

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="namesCtrl">

<input type="text" ng-model="searchText"/>
<ul ng-init="nameArray=objArray(names)">
  <li ng-repeat="x in nameArray | filter:searchText | orderBy: 'value.name'">
    {{x.value.name}}
  </li>
</ul>

</div>

<script>

angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.searchText='';
    $scope.names = {
  "1": {
       "name": "some"
  },
  "2": {
       "name": "values"
  },
  "3": {
        "name": "are"
  },
  "4": {
       "name": "there"
  },
  "5": {
        "name": "here"
  }
    };
$scope.objArray=function (obj) {
    var result=[];
    for (var key in obj) {
        result.push({
            key: key,
            value: obj[key]
        });
    }
    return result;
}


});
</script>

</body>
</html>




{{x.value.name}


角度.module（'myApp'，[]）.controller（'namesCtrl'，function（$scope）{
$scope.searchText=''；
$scope.names={
"1": {
“姓名”：“一些”
},
"2": {
“名称”：“值”
},
"3": {
“名称”：“是”
},
"4": {
“名称”：“有”
},
"5": {
“名称”：“此处”
}
};
$scope.objArray=函数（obj）{
var结果=[]；
for（obj中的var键）{
结果：推({
钥匙：钥匙，
值：obj[键]
});
}
返回结果；
}
});

与过滤器一样，orderBy仅适用于阵列。一个简单的解决方案是使用从对象返回数组的函数：

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="namesCtrl">

<input type="text" ng-model="searchText"/>
<ul ng-init="nameArray=objArray(names)">
  <li ng-repeat="x in nameArray | filter:searchText | orderBy: 'value.name'">
    {{x.value.name}}
  </li>
</ul>

</div>

<script>

angular.module('myApp', []).controller('namesCtrl', function($scope) {
    $scope.searchText='';
    $scope.names = {
  "1": {
       "name": "some"
  },
  "2": {
       "name": "values"
  },
  "3": {
        "name": "are"
  },
  "4": {
       "name": "there"
  },
  "5": {
        "name": "here"
  }
    };
$scope.objArray=function (obj) {
    var result=[];
    for (var key in obj) {
        result.push({
            key: key,
            value: obj[key]
        });
    }
    return result;
}


});
</script>

</body>
</html>




{{x.value.name}


角度.module（'myApp'，[]）.controller（'namesCtrl'，function（$scope）{
$scope.searchText=''；
$scope.names={
"1": {
“姓名”：“一些”
},
"2": {
“名称”：“值”
},
"3": {
“名称”：“是”
},
"4": {
“名称”：“有”
},
"5": {
“名称”：“此处”
}
};
$scope.objArray=函数（obj）{
var结果=[]；
for（obj中的var键）{
结果：推({
钥匙：钥匙，
值：obj[键]
});
}
返回结果；
}
});

我认为最好且优雅的解决方案是制作一个过滤器，将对象更改为数组。因此，您可以在模板中重用所有项目，而无需编写任何js

以下是过滤器的外观：

(function () {
    'use strict';

    angular.module('app').filter('toArray', toArray);

    toArray.$inject = [];

    function toArray() {
        return toArrayFilter;
        function toArrayFilter(input) {
            if (angular.isArray(input)) return input;
            var list = [];
            angular.forEach(input, iterateProperty, list);
            return list;
            function iterateProperty(elt, key) {
                this.push({ key: key, value: elt });
            }
        }
    }
})();

下面是如何在html模板中使用它：

<div ng-repeat="element in myObject | toArray | orderBy:value">
    {{element.key}}:
    <pre>{{element.value | json}}</pre>
</div>


{{element.key}}：
{{element.value}json}

我认为最好且优雅的解决方案是制作一个过滤器，将对象更改为数组。因此，您可以在模板中重用所有项目，而无需编写任何js

以下是过滤器的外观：

(function () {
    'use strict';

    angular.module('app').filter('toArray', toArray);

    toArray.$inject = [];

    function toArray() {
        return toArrayFilter;
        function toArrayFilter(input) {
            if (angular.isArray(input)) return input;
            var list = [];
            angular.forEach(input, iterateProperty, list);
            return list;
            function iterateProperty(elt, key) {
                this.push({ key: key, value: elt });
            }
        }
    }
})();

下面是如何在html模板中使用它：

<div ng-repeat="element in myObject | toArray | orderBy:value">
    {{element.key}}:
    <pre>{{element.value | json}}</pre>
</div>


{{element.key}}：
{{element.value}json}

在1.4 angular之前，它们总是按字母顺序排列，而您无法控制它们，您必须将其转换为过滤器中的数组，或者在将其转换为dom之前。在1.4 angular之前，它们总是按字母顺序排列，您无法控制它，您必须将其转换为过滤器中的数组，或者在将其转换为dom之前将其转换为数组。