我正在尝试显示一个由Web服务中的JSON创建的表,然后我创建一个数组。数组长度为0,当我单击一个按钮时,我将1个元素添加到数组并向表中添加一个新行。当我点击按钮时,不会在阵列上添加元素,也不知道为什么。在同一个控制器上可以有2个不同的ng-repeat并查看吗?
有控制器:
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-click放在按钮标签上,而不是span标签
此致
答案 0 :(得分:1)
你的ng-click应该在按钮标签而不是跨度
答案 1 :(得分:0)
我认为您想要做的事情需要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>
查看文档here