Angularを使用してチェックボックスをクリックした場合、親要素にng-classを適用しますか？

Question

親リストには、リストをクリックすると表示されるチェックボックスのドロップダウンがあります。私がしたいのは、いずれかのチェックボックスがチェックされている場合、親リストクラスに「アクティブ」を与えることです。私は複数のリストを持っているので、チェックボックスがオンになっていると、アクティブなクラスを取得するためのチェックボックスのみが必要なときに、すべてのリストがそのクラスを取得します。これをどのようにリファクタリングすれば、すべてのリストではなく、親リストに「アクティブ」クラスだけが与えられますか？

HTML：

<ul ng-repeat="type in filterTypes"> 
    <li ng-repeat="filter in type.filters" ng-class="{active:checked}">{{filter.value | uppercase}} 
     <ul> 
      <li ng-repeat="option in filter.options"> 
       <label> 
        //if any checkbox is checked, the active class should be given to the parentd list at the way top. 
        <input type="checkbox" ng-model="checked"/> 
        {{option}} 
       </label> 
      </li> 
     </ul> 
    </li> 
</ul> 

指令：

return { 
    restrict: "E", 
    templateUrl: 'scripts/directives/all-filters.html', 
    link: function(scope, el, attr) { 
     scope.filterTypes = dummyData.filters; 
    } 
} 

Answer 1

ng-model="option.checked"

にモデルを変更することにより、各オプションにチェックするプロパティを適用するとli要素に変更ng-classフィルタ内のいずれかのオプションが

$scope.isAnyChecked = function(filter) { 
    for (var i = 0; i < filter.options.length; i++) { 
     if (filter.options[i].checked) { 
      return true; 
     } 
    } 
    return false; 
} 

をチェックされている場合には、フィルタ `に真

ng-class="isAnyChecked(filter) ? 'active' : ''" 

Answer 2

<input ng-model='checked' ng-change='filter.checked=checked'/>