我在角度材质对话框(mdDialog)中使用ng-repeat时遇到问题。 ng-repeat重复自身,取决于数组的长度,如果它有4个元素,那么它会运行很多次。
我想要的是打印一个复选框列表:
这是我的HTML代码:
<div id="tourDateForm" class="col-md-12 hidden">
<md-dialog>
<md-toolbar>
</md-toolbar>
<md-dialog-content>
<form id="tourForm" class="dialogContent">
<input type="hidden" name="id" ng-model="id">
<label for="ticket">Ticket</label>
<label ng-repeat="ticketd in ticketData">
<input type="checkbox" name="ticket" value="" required>
{{ticketd.test}}
</label>
</form>
</md-dialog-content>
<md-dialog-actions>
</md-dialog-actions>
</md-dialog>
我的控制员:
var tours = angular.module('tourDates', ['ngMaterial']);
tours.controller('tourDateCtrl', ['$scope','$mdDialog', function ($scope, $mdDialog) {
$scope.ticketData = [{test:1},{test:2}, {test: 3}, {test: 4}];
$scope.showForm = function (ev) {
$mdDialog.show({
controller: DialogController,
scope: $scope,
preserveScope: false,
template: angular.element('#tourDateForm').html(),
parent: angular.element(document.body),
targetEvent: ev
});
}
function DialogController($scope, $mdDialog) {
$scope.save = function () {
console.log('submit');
};
$scope.cancel = function () {
$mdDialog.cancel();
};
}
}]);
这是一个codepen:
http://codepen.io/cladin/pen/LZxJvJ
任何人都知道发生了什么或我做错了什么?
答案 0 :(得分:1)
而不是使用
template: angular.element('#tourDateForm').html(),
你应该使用templateURL因为如果你检查它有四个已经渲染了tourDataForm。现在如果要将它传递给mddialog这个模板:angular.element(&#39;#tourDateForm&#39;)。html (),它已经有4 ngrepeat。每次ngrepeat将4次,因此16次获得复选框
例如
templateUrl: 'tabDialog.tmpl.html',