说我有一个对象,对应于与对象相对应的产品和值对应的对象,这些对象又具有对应于这些产品出售的价格点的键,以及对应于销售量的值。
例如,如果我以$ 1销售10个小部件,以2美元销售5个小部件,我将拥有数据结构:
{ 'widget': {'1': 10,'2': 5} }
我想循环这个结构,并在一个表中生成行,如这个:
thing price amount --------------------- widget $1 10 widget $2 5
在Python中,可以嵌套列表推导来遍历列表这样的数据结构。这样的事情可以使用ng-repeat吗?
ng-repeat当前没有可能的方式来复杂的内部对象迭代(在python中可能的方式)。查看ng-repeat
source code,并注意正则表达式匹配是:
(key,value)在集合中 – 并且它们推入密钥数组并分配给值列表,所以你不可能有一个复杂的重复悲伤…
这里已经回答了两种类型的解决方案:
>像建议的第一个答案一样嵌套ng-repeat。
>重建您的数据对象以适应1 ng重复,就像第二个建议的答案一样。
我认为解决方案2更好,因为我喜欢保持我的排序和控制器内的编码逻辑,而不是在HTML文档中处理它。这也将允许更复杂的排序(即基于价格,数量,widgetName或其他一些逻辑)。
另一件事 – 第二个解决方案将遍历数据集的可能方法(因为没有使用hasOwnProperty)。
我已经改进了这个Plunker(基于finishmove Plunker)的解决方案,以便使用angular.forEach,并显示该解决方案相当简单,但允许复杂的排序逻辑。
$scope.buildData = function() { var returnArr = []; angular.forEach($scope.data,function(productData,widget) { angular.forEach(productData,function( amount,price) { returnArr.push( {widgetName: widget,price:price,amount:amount}); }); }); //apply sorting logic here return returnArr; }; $scope.sortedData = $scope.buildData();
然后在你的控制器中:
<div ng-controller="MyCtrl"> <table> <thead> <tr> <td>thing</td> <td>price</td> <td>amount</td> </tr> </thead> <tbody> <tr ng-repeat="item in sortedData"> <td>{{ item.widgetName }}</td> <td>{{ item.price|currency }}</td> <td>{{ item.amount }} </td> </tr> </tbody> </table> </div>