[英]How to validate element directive in angularjs
我想在angularjs中驗證多選。 多選中至少應選擇一項。 如果沒有,則提交按鈕不應啟用。 我正在使用require來驗證表格。 我可以通過使用require來強制選擇名字 ,但是對於multiselect來說也必須這樣做 。
形成
<form ng-submit='addStudent()' name='studentForm' novalidate="">
<div class="col-md-4">
<div class="col-md-12">
<label for="Name">First Name *</label>
<input ng-model='student.first_name' name="name" type="text" placeholder="First Name" required class="form-control">
</div>
</div>
<div class="col-md-4">
<div class="col-md-12">
<label for="Name">Last Name </label>
<input ng-model='student.last_name' name="name" type="text" placeholder="Last Name" class="form-control">
</div>
</div>
<multi-selection selectedsubjs="student.selectedSubjects"
allsubjects="allSubjects"
left-title="All Subjects"
right-title="Selected Subjects">
</multi-selection>
<input ng-disabled="sutudentForm.$invalid" type="submit">
</form>
元素指令
app.directive('multiSelection', function(){
return {
restrict: 'E',
scope: {
allsubjects: '=',
selectedsubjs: '=',
displayAttr: '@',
leftTitle: '@',
rightTitle: '@'
},
templateUrl: "templates/multiSelection.html",
link: function(scope) {
scope.swapsubject1 = function(item) {
var index = scope.allsubjects.indexOf(item);
scope.allsubjects.splice(index, 1);
scope.selectedsubjs.push(item);
}
scope.swapsubject2 = function(item) {
var index = scope.selectedsubjs.indexOf(item);
scope.selectedsubjs.splice(index, 1);
scope.allsubjects.push(item);
}
}
};
});
多選模板
<tr>
<td>
<div class="entBox">
<switchitem ng-repeat="subj in allsubjects" value="subj.name" ng-click="swapsubject1(item)" ng-model="allSubjects"></switchitem>
</div>
</td>
<td>
<div class="entBox">
<switchitem ng-repeat="subj in selectedsubjs" value="subj.name" ng-click="swapsubject2(item)" ng-model="student.selectedSubjects"></switchitem>
</div>
</td>
</tr>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.