Angularjs Неопределенного Checkbox Slow

Question

У меня есть неопределенный флажок, как это:

http://jsfiddle.net/cjwprostar/M4vGj/6/

Он работает, но он использует $ смотреть.

scope.$watch(childList, function(newValue) { 
      var hasChecked = false; 
      var hasUnchecked = false; 

      // Loop through the children 
      angular.forEach(newValue, function(child) { 
       if (child[property]) { 
        hasChecked = true; 
       } else { 
        hasUnchecked = true; 
       } 
      }); 

      // Determine which state to put the checkbox in 
      if (hasChecked && hasUnchecked) { 
       element.prop('checked', false); 
       element.prop('indeterminate', true); 
       if (modelCtrl) { 
        modelCtrl.$setViewValue(false); 
       } 
      } else { 
       element.prop('checked', hasChecked); 
       element.prop('indeterminate', false); 
       if (modelCtrl) { 
        modelCtrl.$setViewValue(hasChecked); 
       } 
      } 
     }, true); 

Если я создаю эти флажки в нг-повторить это замедляет пользовательский интерфейс. Можно ли переписать эту часть кода, чтобы не использовать $ watch? Thx для любой помощи.

Answer 1

Как насчет без indeterminateCheckbox директивы?

Удалить директиву, затем добавить метод ng-change вашего второго уровня (фруктового) checkbox которые гарантируют, что все детали проверены или не нравится

<input type="checkbox" ng-change="checkAllEaten(person.name)" data-ng-model="fruit.eaten"> 

В вас контроллер

$scope.checkAllEaten = function (name) { 
    var person = $scope.model.people.filter(function(p){ 
     return p.name === name; 
    })[0]; 

    var result = person.fruits.reduce(function (p, c) { 
     if (!p) return false; 
     return c.eaten && true || false; 
    }, true); 

    person.allEaten = result;   
}; 

//initialization 
$scope.model.people.forEach(function(item){ 
    $scope.checkAllEaten(item.name); 
}); 

Обновлено fiddle