如何爲AngularJS表單驗證至少要求1個複選框？

Question

我有一個顯示在窗體中的JSON對象數組。我想要進行表單驗證工作，用戶必須至少選擇一個複選框才能使整個表單有效。

我知道ng-required可以使用，但對於我的實現，這意味着它們都必須被選中使其有效。

這裏是我的代碼至今：

的index.html：

<div ng-repeat="item in volunteerOptions"> 
    <label class="checkbox"><input type="checkbox" value="" data-ng-model="item.selected" ng-required="true">{{ item.content }}</label> 
</div> 

<button type="submit" class="btn btn-success" ng-disabled="!memberRegistrationForm.$valid">Submit</button> 

controller.js

$scope.volunteerOptions = [ 
     { content : 'Content 1', selected : false }, 
     { content : 'Content 2', selected : false }, 
     { content : 'Content 3', selected : false }, 
     { content : 'Content 4', selected : false }, 
]; 

我如何將能夠任何想法實現這種行爲？

Answer 1

您可以添加其他範圍屬性並使用array.some來檢查selected是否有true。然後將該範圍屬性提供給ng-required。類似於

$scope.isOptionsRequired = function(){ 
    return !$scope.volunteerOptions.some(function(options){ 
    return options.selected; 
    }); 
} 

<input type="checkbox" value="" data-ng-model="item.selected" ng-required="isOptionsRequired()">