8
Tôi muốn tạo biểu mẫu với các trường được tạo theo chỉ thị. Dữ liệu ràng buộc dữ liệu hoạt động chính xác nhưng xác thực không hoạt động.Làm cách nào để xác thực các trường biểu mẫu động trong chỉ thị góc?
đây là html:
<body ng-controller="MainCtrl">
<h1>form</h1>
<form name="form">
<div ng-repeat="conf in config">
<div field data="data" conf="conf"></div>
</div>
</form>
<pre>{{data|json}}</pre>
</body>
điều khiển và lĩnh vực chỉ:
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.data = {name: '', age: ''}
$scope.config = [
{field: 'name', required:true},
{field: 'age'}
];
});
app.directive('field', function ($compile) {
return {
scope: {
data: '=',
conf: '='
},
link: function linkFn(scope, element, attrs) {
// field container
var row = angular.element('<div></div>');
// label
row.append(scope.conf.field + ': ');
// field input
var field = angular.element('<input type="text" />');
field.attr('name', scope.conf.field);
field.attr('ng-model', 'data.' + scope.conf.field);
if (scope.conf.required) {
field.attr('required', 'required');
}
row.append(field);
// validation
if (scope.conf.required) {
var required = angular.element('<span>required</span>');
required.attr('ng-show',
'form.' + scope.conf.field + '.$error.required');
row.append(required);
}
$compile(row)(scope);
element.append(row);
}
}
});
vấn đề là xác nhận cho lĩnh vực name không hoạt động và xác nhận văn bản required không bao giờ được hiển thị. Có thể là form trong ng-show không xác định trong chỉ thị. Nhưng tôi không biết cách chuyển biểu mẫu vào chỉ thị trường. Bạn có thể giúp tôi làm thế nào để sửa chữa nó? Cảm ơn.
đây là mã trực tiếp: http://plnkr.co/edit/j0xc7iV1Sqid2VK6rMDF?p=preview
Tôi đang chiến đấu với cùng một vấn đề. Tôi tìm thấy một tính năng không có giấy tờ trong nguồn góc: 'FormController' có các phương thức' $ addControl' và '$ removeControl'. Tôi đang nghĩ đến việc khai thác các phương thức này để tự động thêm các điều khiển cho cha 'FormController' từ trong chỉ thị. Sẽ cho bạn biết nếu tôi thành công. –