Директива Angularjs для создания грязной формы без ng-модели

Question

Я использую Angular 1.5.1. У меня есть флажок в моей форме. Меня не волнует индикатор истины/ложности флажка, который проверяется/снят, и поэтому я не хочу, чтобы на нем была ng-модель. То, что я все равно за это:

• когда флажок снят, я удалить конкретный массив из моей модели
• когда флажок установлен, то я добавить пустой массив обратно в моей модели

Я создали директиву, которая предоставляет мне эту функциональность, очень просто:

.directive('cbOnChecked', function() { 
    return { 
     restrict: 'A', 
     link: function(scope, element, attr) { 
      element.on('click', function(event) { 
       if(element[0].checked) 
        scope.$apply(attr.cbOnChecked); 
      }); 
     } 
    }; 
}) 

.directive('cbOnUnchecked', function() { 
    return { 
     restrict: 'A', 
     link: function(scope, element, attr) { 
      element.on('click', function(event) { 
       if(!element[0].checked) 
        scope.$apply(attr.cbOnUnchecked); 
      }); 
     } 
    }; 
}) 

Теперь я могу сделать что-то вроде:

<input type="checkbox" cb-on-checked="counter = counter + 1" cb-on-unchecked="counter = counter - 1"/> 

Или

<input type="checkbox" cb-on-checked="deleteUserList()" cb-on-unchecked="users = []"/> No users<br/> 

Проблема с этим - форма, в пределах которого флажок не будут помечены как $dirty если нет ng-model на флажке. Есть ли способ обойти это?
Here - пример js-скрипка. Благодарю.

Answer 1

Если вы действительно хотите идти со своими собственными директивами вы можете просто требуют родительской формы контроллера и отметьте его $dirty вручную:

.directive('cbOnChecked', function() { 
    return { 
     require: '^form', 
     restrict: 'A', 
     link: function(scope, element, attr, ngFormController) { 
      element.on('click', function(event) { 
       ngFormController.$setDirty(); 
       if(element[0].checked) 
       scope.$apply(attr.cbOnChecked); 
      }); 
     } 
    }; 
})