如何以ng重复指定动态范围对象
问题描述:
我有一个HTML代码如何以ng重复指定动态范围对象
<tr ng-repeat='row in po123'>
<td>{{row.buyerLineItemNumber}}</td>
<td>{{row.buyerPartNumber}}</td>
<td>{{row.supplierPartNumber}}</td>
<td>{{row.itemDescription}}</td>
<td>{{row.itemQuantity}}</td>
<td>{{row.itemQuantityUOM}}</td>
</tr>
和范围元素
var poNumber = "123";
$scope.poNumber = poNumber;
$scope["po"+poNumber] = [{'buyerLineItemNumber':'12121','buyerPartNumber':'buyerPartNumber','supplierPartNumber':'supplierPartNumber','itemDescription':'itemDescription','itemDescription':'itemDescription','itemQuantityUOM':'itemQuantityUOM'}];
在appication poNumbe r是动态生成的,并且可以作为$ scope值使用,并且我使用poNumber创建动态范围元素。我如何在ng-repeat中使用这个动态创建的范围元素。
如果我在代码中静态指定片断它工作得很好,我想指定像<tr ng-repeat='row in "po"+{{poNumber}}'>
我怎样才能做到这一点?
答
两个选项:
第一:
var poNumber = "123";
$scope.poNumber = poNumber;
$scope.myData = {};
$scope.myData["po"+poNumber] = [{'buyerLineItemNumber':'12121','buyerPartNumber':'buyerPartNumber','supplierPartNumber':'supplierPartNumber','itemDescription':'itemDescription','itemDescription':'itemDescription','itemQuantityUOM':'itemQuantityUOM'}];
和HTML:
<tr ng-repeat='row in myData["po"+poNumber]'>
二:
// add to controller
$scope.getByName = function (value) {
return $scope[value]
};
和HTML:
<tr ng-repeat='row in getByName("po"+poNumber)'>
答
它似乎是您使用poNumber作为您的范围中的每个数据的ID,您只需要使用该数组的对象。
如果你设置:
$scope.myArray = [];
,只要你想添加与买家数据的新对象,你只需要做一个控制器中的功能的下一个内部或方法或监听器,它取决于你需要什么:
var newBuyerData ={
'buyerLineItemNumber':'12121',
'buyerPartNumber':buyerPartNumber,
'supplierPartNumber':supplierPartNumber,
'itemDescription':itemDescription,
'itemDescription':itemDescription,
'itemQuantityUOM':itemQuantityUOM};
$scope.myArray.push(newBuyerData);
,然后你将有一个数组与人你要显示的对象,然后你就可以做NG重复,因为使用该类型的数据,ng-repeat实例化数据集合中的每个项目。
<tr ng-repeat='row in myArray'>
<td>{{row.buyerLineItemNumber}}</td>
<td>{{row.buyerPartNumber}}</td>
<td>{{row.supplierPartNumber}}</td>
<td>{{row.itemDescription}}</td>
<td>{{row.itemQuantity}}</td>
<td>{{row.itemQuantityUOM}}</td>
</tr>
有了这个,你将能够有一个列表的买家数据与所有列出的数据,你想。另一方面,如果您只想显示1位买家,您仍然可以拥有买家数据数组,并且只需将它添加一个名为id(element_id)的字段,就可以生成randombly,它将如下所示:
var idNumber = 1000;
var newBuyerData ={
'element_id': idNubmer,
'buyerLineItemNumber':'12121',
'buyerPartNumber':buyerPartNumber,
'supplierPartNumber':supplierPartNumber,
'itemDescription':itemDescription,
'itemDescription':itemDescription,
'itemQuantityUOM':itemQuantityUOM};
$scope.myArray.push(newBuyerData);
idNumber = idNumber + 1;
这部分应该是一个方法或function.So里面,每当你怎么称呼它,它会在新数据添加到阵列中,然后将增加的ID号变量。
然后你可以只搜索你想要的数据,并只显示1个买家数据项。
var itemThatIWant = 123; //the number that i want, you can insert this //number with an input text or something
$scope.itemToShow = "";
angular.forEach($scope.myArray,function(item){
if(item.idNumber === itemThatIWant){
$scope.itemToShow = item;
}
});
然后在你的HTML,您将不需要NG重复,你可以用你的itemToShow变量:
<tr >
<td>{{itemToShow.buyerLineItemNumber}}</td>
<td>{{itemToShow.buyerPartNumber}}</td>
<td>{{itemToShow.supplierPartNumber}}</td>
<td>{{itemToShow.itemDescription}}</td>
<td>{{itemToShow.itemQuantity}}</td>
<td>{{itemToShow.itemQuantityUOM}}</td>
</tr>
我希望它能帮助:)
什么是你想实现?应该由控制器负责决定哪些数据将被显示,而不是视图,什么阻止您在控制器中进行动态选择? – pedromarce