/*------Factory method---------*/
factory.getAllOrders = function() {
var orders = [];
for(var i=0, len=customers.length; i<len; i++){
if(customers[i].orders) {
for(var j=0,ordersLen=customers[i].orders.length; j<ordersLen; j++){
return customers[i].orders;
}
}
}
};
return factory;
/*-----------All orders controller--------------*/
myApp.controller('AllOrdersController',['$scope','$routeParams','customersFactory', function($scope,$routeParams,customersFactory) {
$scope.orders = null;
$scope.ordersTotal = 0.0;
$scope.totalType;
function init() {
$scope.orders = customersFactory.getAllOrders();
}
function getOrdersTotal(){
var total = 0;
for(var i=0,len=$scope.orders.length; i<len; i++) {
total += $scope.orders[i].total;
}
$scope.ordersTotal = total;
$scope.totalType = ($scope.ordersTotal > 100) ? 'success' :'danger';
}
init();
]);
<!-- View -->
<div class="container">
<div class="row">
<div class="col-md-4">
<h2>Customers Orders</h2>
br/>
Filte:<input class="form-control" type="text" ng-model="orderFilter.product" />
<br/>
<br/>
</div>
</div>
/div>
div class="container">
<div class="row">
<div class="col-md-12">
<table class="table table-responsive">
<tr>
<th>Product</th>
<th>Total</th>
</tr>
<tr ng-repeat="order in orders | filter:orderFilter | orderBy:'name'">
<td>{{order.product}}</td>
<td>{{order.total | currency}}</td>
</tr>
<tr>
<td> </td>
<td>{{ordersTotal | currency}}</td>
</tr>
</table>
</div>
</div>
/div>
/*--------------JSON FIle-----------------*/
var customers = [
id: "1",
joined: "2000-12-2",
name: "Wali",
city: "Dubai",
orderTotal: "9.0765",
orders: [{
id: "1",
product: "protein",
total: "11.987"
}]
},
{
id: "2",
joined: "2004-12-2",
name: "Ali",
city: "London",
orderTotal: "20.0765",
orders: [{
id: "2",
product: "bcca",
total: "2.3456"
}, {
id: "3",
product: "baseball",
total: "4.3456"
}]
}];
我有一个控制器，可以显示json文件中的所有订单，并且已经通过工厂方法给出了所有订单的功能。我想打印表格以解析json文件中的数据并给出客户的所有订单，但是它仅显示第一个客户的订单，并且我想显示所有订单。
您正在过早返回数据。线
return customers[i].orders;
仅在工厂内循环和外循环的第一遍通过后（i = 0，j = 0）才将控制权返回给控制器，这就是为什么只得到第一位客户的订单的原因。相反，如果要所有客户的订单，则应遍历客户并将其相应的订单推入已声明的订单数组中。这是该代码：
factory.getAllOrders = function() {
var orders = [];
for(var i=0, len=customers.length; i<len; i++){
if (customers[i].orders) {
ordersLen=customers[i].orders.length;
for (var j=0; j<ordersLen; j++){
orders.push(customers[i].orders[j]);
}
}
}
return orders;
};
return factory;
但是，这将返回对象数组，并且ng-repeater会认为存在重复项，因为在表面上它们都是Object。在这种情况下，建议使用track by选项。以下是修改后的ng-repeater代码：
<table class="table table-responsive">
<tr>
<th>Product</th>
<th>Total</th>
</tr>
<tr ng-repeat="order in orders | filter:orderFilter | orderBy:'name' track by $index">
<td>@{{order.product}}</td>
<td>@{{order.total | currency}}</td>
</tr>
<tr>
<td> </td>
<td>@{{ordersTotal | currency}}</td>
</tr>
</table>
希望这可以帮助。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句