在单个视图上重复多个 ng
Multiple ng-repeat on a single view
我试图显示一个由来自Web服务的JSON组成的表,然后我创建了一个数组。数组长度为 0,当我单击一个按钮时,我将 1 个元素添加到数组并向表中添加一个新行。当我单击按钮时,不会在数组上添加元素,也不知道为什么。是否可以在同一控制器和视图上具有 2 个不同的 ng 重复?
有控制器:
assets.controller('EditaTipusCtrl', function ($scope, $http, $routeParams) {
$http.get('http://10.0.203.73/WS/ws.php/tipusactius/getDetails/' + $routeParams.id).success(function (data) {
$scope.atrb = data;
});
$scope.nousAtributs = [];
$scope.addNewLine = function () {
var newRow = {
"nomAtribut": "",
"tipus": "",
"mida": '',
"prioritat": "",
"obligatori": "",
"observacions": "",
"nomTipusActiu": $routeParams.id // nom del tipus d'actiu
};
$scope.nousAtributs.push(newRow);
// return $scope.nousAtributs;
}
});
和观点:
<div class="col-md-10">
<div ng-controller="EditaTipusCtrl" id="test">
<div class="row">
<button class="btn btn-default" >
<span class="glyphicon glyphicon-plus" aria-hidden="true" ng-click="addNewLine()"></span>
Afegir atribut
</button>
</div>
<br />
<table class="table">
<tr>
<th>#</th>
<th><a href="" ng-click="sortField = 'ordre'; reverse = !reverse">Prioritat</a></th>
<th><a href="" ng-click="sortField = 'nomAtribut'; reverse = !reverse">Atribut</a></th>
<th><a href="" ng-click="sortField = 'midaAtribut'; reverse = !reverse">Mida</a></th>
<th><a href="" ng-click="sortField = 'atributObligatori'; reverse = !reverse">Obligatori</a></th>
<th><a href="" ng-click="sortField = 'observacions'; reverse = !reverse">Observacions</a></th>
</tr>
<tr ng-repeat="(key, value) in atrb">
<td></td>
<td>
<input type="number" ng-model="value.ordre" value="value.ordre" />
</td>
<td>
<input type="value.valor" ng-model="value.nomAtribut" value="value.nomAtribut" />
</td>
<td>
<input type="value.valor" ng-model="value.midaAtribut" value="value.midaAtribut" />
</td>
<td>
<input type="checkbox" ng-model="value.atributObligatori" value="value.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" />
</td>
<td>
<input type="value.valor" ng-model="value.observacions" value="value.observacions" />
</td>
</tr>
<tr ng-repeat="a in nousAtributs">
<td></td>
<td>
<input type="number" ng-model="a.ordre" value="a.ordre" />
</td>
<td>
<input type="a.valor" ng-model="a.nomAtribut" value="a.nomAtribut" />
</td>
<td>
<input type="a.valor" ng-model="a.midaAtribut" value="a.midaAtribut" />
</td>
<td>
<input type="checkbox" ng-model="a.atributObligatori" value="a.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" />
</td>
<td>
<input type="a.valor" ng-model="a.observacions" value="a.observacions" />
</td>
</tr>
</table>
<button class="btn btn-default" >
<span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>
Guardar
</button>
</div>
</div>
解决:
我把 ng 点击放在按钮标签上,而不是 span 标签
问候
您的 ng-click 应该在按钮标签中,而不是跨度
我认为你想做的事情需要ng-repeat-start
和ng-repeat-end
.所以你会有;
<tr ng-repeat-start="(key, value) in atrb">
<td></td>
<td>
<input type="number" ng-model="value.ordre" value="value.ordre" />
</td>
<td>
<input type="value.valor" ng-model="value.nomAtribut" value="value.nomAtribut" />
</td>
<td>
<input type="value.valor" ng-model="value.midaAtribut" value="value.midaAtribut" />
</td>
<td>
<input type="checkbox" ng-model="value.atributObligatori" value="value.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" />
</td>
<td>
<input type="value.valor" ng-model="value.observacions" value="value.observacions" />
</td>
</tr>
<tr style="display:none;" ng-repeat-end></tr>
<tr ng-repeat-start="a in nousAtributs">
<td></td>
<td>
<input type="number" ng-model="a.ordre" value="a.ordre" />
</td>
<td>
<input type="a.valor" ng-model="a.nomAtribut" value="a.nomAtribut" />
</td>
<td>
<input type="a.valor" ng-model="a.midaAtribut" value="a.midaAtribut" />
</td>
<td>
<input type="checkbox" ng-model="a.atributObligatori" value="a.atributObligatori" ng-true-value="'Si'" ng-false-value="'No'" />
</td>
<td>
<input type="a.valor" ng-model="a.observacions" value="a.observacions" />
</td>
</tr>
<tr style="display:none;" ng-repeat-end></tr>
在此处查看文档
相关文章:
- 如何从ng重复单个范围更改父范围 - Angular JS
- 在单个ng重复中创建多个td
- 更改一个ng重复上的单个迭代
- 如何使用angularjs在单个ng-init-directice中调用多个函数
- 在单个视图上重复多个 ng
- 使用单个 ng 模型筛选结果并显示筛选方法
- ng-重复对象数组和单个对象
- AngularJS嵌套了带有单个索引的ng-repeats
- 角度 - 我可以在嵌套的 ng-repeat 中的多个对象上使用单个函数来触发该对象的 ng-show 吗?
- 从 NG 绑定结果访问单个对象
- AngularJS在ng重复中选择单个表单元格
- 如何在AngularJS中为单个元素使用ng样式的多个对象
- 可以't使用ng src-Angularjs加载单个本地
- ng模型不会为文本过滤器重新计算单个按键的数组长度
- WishList布尔切换按钮切换ng重复中的所有项目,而不是单个项目
- Angular JSON显示单个结果,无需Ng重复过滤器
- 如何使用ng-repeat从包含5行的表传递单个复选框值
- AngularJS - ng-repeat多次显示单个记录
- 在使用ng-class的ng-repeat中,三元制不能处理单个除法
- Angularjs的ng-repeat必须只显示在单个<