Miranda Miranda - 1 month ago 11
AngularJS Question

how to bind and show array of array in angularjs

I'm trying to bind and show the value of array. When I'm assigning the value with the scope variable like this:

$scope.StockList = obj.data


It's working fine but when I'm pushing the value inside the array like this

$scope.StockList.push(obj.data);


It is not working as expected

Here I'm stuck with ng-repeat and scope variable. Can any one help me
here is my effort.

$scope.StockList = [];
$scope.IsVisible = false;
var Stocks = [];

function GetStockEntries(loid, pid) {
var data = { LocationId: loid, ProductId: pid }
return $http.post(serviceURL + "/GetLocationStockEntries", data).then(
function success(data, status, headers, config) {
var obj = JSON.parse(data.data.d)

//working fine in case single array
//$scope.StockList = obj.data
$scope.StockList.push(obj.data);
},
function error(data, status, headers, config) {
return data
}
)
}

$scope.StockListing = function (item) {
debugger
$scope.IsVisible = !$scope.IsVisible
console.log($scope.StockList)
}


ng repeat code

<table cellpadding="5" cellspacing="0" class="stocktransferdiv">
<tr>
<td colspan="4">
<table cellpadding="5" cellspacing="0" data-ng-repeat="stockItem in StockList" data-ng-show = "IsVisible" data-ng-cloak width="100%">
<tr style="border-bottom: 1px solid #ddd; padding-bottom: 5px; margin-bottom: 5px; float: left;">
<td>
<input type="radio" name="groupName" data-ng-value="true" data-ng-model="stockItem.selected" data-ng-change="onTaskSelect(stockItem)" />
</td>
<td>
<input type="text" data-ng-model="stockItem.UserInventoryItemID"disabled="" readonly="" style="border: none; background-color: white;">
</td>
<td>
<input type="text" data-ng-model="stockItem.LotNumber" disabled="" readonly="">
</td>
<td>
<!--<input type="text" data-ng-model="stockItem.QuantityOnHand" disabled="" readonly="">-->
<span>{{stockItem.QuantityOnHand}}</span>
<span>{{stockItem.UnitName}}</span>
</td>
<td>
<input type="text" data-ng-model="stockItem.EnteredQuantity" >
</td>
<td>
<input type="text" data-ng-model="stockItem.Description" disabled="" readonly="">
</td>
</tr>
</table>
</td>
</tr>
</table>


Here is the result of that json

enter image description here

Answer

Your service returns an array of objects, you need to loop over them and add it to the array,

var obj = data.data.d; 
$scope.result = obj ;
$scope.result.forEach(function(key) { 
$scope.StockList.push(key); 
})