[英]Angular JS nested ng-repeat of only one top-level object?
我在JSON對象中有包裝訂購數據。 我可以像下面這樣進行嵌套循環,並列出所有訂單,然后列出每個訂單中的包裹,然后列出每個包裹中的SKU。
<div ng-repeat="order in orders">
order {{order.ordernum}}
<div ng-repeat="parcel in order.parcels">
{{parcel.upid}}
<div ng-repeat="sku in parcel.skus">
{{sku.sku}}{{sku.commodity}}
</div>
</div>
</div>
但是,我只想要特定訂單的詳細信息,而不是所有訂單。 現在,如果這是我想要的第一筆訂單。 我可以用這個:
<div ng-repeat="order in orders | limitTo: 1">
order {{order.ordernum}}
<div ng-repeat="parcel in order.parcels">
{{parcel.upid}}
<div ng-repeat="sku in parcel.skus">
{{sku.sku}}{{sku.commodity}}
</div>
</div>
</div>
注意“ limitTo:1”過濾器。 但是,如果我想要一個不同的索引甚至更好的匹配訂單號(“ ordernum”)怎么辦?
您可以為此使用filter
器filter
器(此處假設theOrder
是具有所需訂單號的范圍變量):
<div ng-repeat="order in orders | filter:{ordernum: theOrder}">
function OrderController($scope) { $scope.orders = [{ ordernum: 3, parcels: [{ upid: 9 }, { upid: 15 }] }, { ordernum: 7, parcels: [{ upid: 1 }] }]; $scope.theOrder = 3; }
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.20/angular.min.js"></script> <div ng-app="" ng-controller="OrderController"> <select ng-model="theOrder"> <option value="{{order.ordernum}}" ng-repeat="order in orders">{{order.ordernum}}</option> </select> <div ng-repeat="order in orders | filter:{ordernum: theOrder}"> order {{order.ordernum}} <div ng-repeat="parcel in order.parcels"> {{parcel.upid}} <div ng-repeat="sku in parcel.skus"> {{sku.sku}}{{sku.commodity}} </div> </div> </div> </div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.