我从sql查询中获得angularjs中的数据:
{"orders":[
{
"orderId":"1674","itemId":"468","SubTotal":"40.00","Total":"48.98","Status":"Printed","Title":"Mangled : Large","Quantity":"1","dateCreated":"2009-06-03"
},
{
"orderId":"1674","itemId":"469","SubTotal":"40.00","Total":"48.98","Status":"Printed","Title":"Skull Collage : Large","Quantity":"1","dateCreated":"2009-06-03"
},
{
"orderId":"1675","itemId":"33949","SubTotal":"40.00","Total":"48.98","Status":"Printed","Title":"Summerside '"The Saved'" EP CD -Red or Blue! : BLUE","Quantity":"1","dateCreated":"2009-06-03"
},
{
"orderId":"1674","itemId":"33954","SubTotal":"40.00","Total":"48.98","Status":"Printed","Title":"Summerside '"The Saved'" EP CD -Red or Blue! : RED","Quantity":"1","dateCreated":"2009-06-03"
}]}
现在我想找出有多少记录有相同的orderId,这样我就可以把它们放在相同的section/div并显示为1组。
我使用ng-repeat显示数据。
<div ng-repeat="order in itemorders">
<div class="order-lis-box border-radius">
<div class="up line overflow-hidden text">
<div class="fl black mb10">Order No. <span>{{ order.orderId }}</span><br><span class="capitalize grey F14 bold">Rs. {{ order.Total }}</span></div>
<div class="custom-datetime text-right">{{ order.dateCreated }}</div>
</div>
.
.
.
</div> <!-- order-lis-box -->
我应该添加什么来显示我想要的方式?
要完成类似的事情,您可以使用angular。filter,然后使用GroupBy函数。
在你的应用中注入环形过滤器后,你只需要
<div ng-repeat="(key,value) in orders | groupBy: 'orderId'">
<div class="fl black mb10">Order No. <span>{{ key }}
<div class="order-lis-box border-radius" ng-repeat="order in value">
<div class="up line overflow-hidden text">
</span><br><span class="capitalize grey F14 bold">Rs. {{ order.Total }}</span></div>
<div class="custom-datetime text-right">{{ order.dateCreated }}</div>
</div>
.
.
.
</div>
这是一个活塞,上面有你们的例子。 为什么不创建一个Javascript
函数来将您的JSON
对象更改为
{
"orders":
[
{
"orderId":"1674",
"items" :
[
{
"itemId":"468",
"SubTotal":"40.00",
"Total":"48.98",
"Status":"Printed",
"Title":"Mangled : Large",
"Quantity":"1",
"dateCreated":"2009-06-03"
},
{
"itemId":"469",
"SubTotal":"40.00",
"Total":"48.98",
"Status":"Printed",
"Title":"Skull Collage : Large",
"Quantity":"1",
"dateCreated":"2009-06-03"
},
{
"itemId":"33954",
"SubTotal":"40.00",
"Total":"48.98",
"Status":"Printed",
"Title":"Summerside '"The Saved'" EP CD -Red or Blue! : RED",
"Quantity":"1",
"dateCreated":"2009-06-03"
}
]
},
{
"orderId":"1675",
"items" :
[
{
"itemId":"33949",
"SubTotal":"40.00",
"Total":"48.98",
"Status":"Printed",
"Title":"Summerside '"The Saved'" EP CD -Red or Blue! : BLUE",
"Quantity":"1",
"dateCreated":"2009-06-03"
}
]
}
]
}
,然后它将更容易操作你的HTML
文件
<div ng-repeat="order in itemorders">
<div class="order-lis-box border-radius">
<div class="up line overflow-hidden text">
<div class="fl black mb10">Order No. <span>{{ order.orderId }}</span><br><span class="capitalize grey F14 bold">Rs. {{ order.Total }}</span></div>
<div class="custom-datetime text-right">{{ order.dateCreated }}</div>
</div>
<div class="up line overflow-hidden text" ng-repeat="item in order.items">
<div class="fl black mb10">Item Id<span>{{ item.itemId }}</span><br></div>
.
.
.
</div>
</div>