Question

我使用css构建了一个切换开关，点击该控件只需添加和删除一个CSS类，这会导致切换开关动画。我想在一个带有验证的表单中获得这个切换开关，并且特别想在每次单击控件时将控件设置为$ dirty = true。

我通过设置require: 'ngModel'来设置我的指令，然后将链接功能中的控制器设置为脏，如下所示：

link: function(scope, elem, attrs, ctrl){
            var hasCallback = angular.isDefined(attrs.callback);

            scope.toggle = function(e){

                if(hasCallback){
                    scope.skcallback({event:e});
                }else{
                    scope.ngModel = !scope.ngModel;
                }

                //ctrl.$setDirty(); // This didn't work and didn't even appear to be on the ctrl object
                ctrl.$dirty = true;
                ctrl.$pristine = false;

            }

           scope.$watch('disabled', function(value){
               if(value){
                   elem.addClass('disabled');
               }else{
                   elem.removeClass('disabled');
               }
           })
       }

我尝试了许多不同的方法来使验证工作，但是当我检查DOM时，控件总是设置为ng-pristine并且似乎没有设置为脏。我做错了什么？

Answer 1

解决方案是创建自定义验证器指令（使用Angular 1.3.8测试）：

mod.directive('cvDirtySet', function () {
  return {
    restrict: 'A',
    require: 'ngModel',
    link: function (scope, elem, attrs, ctrl) {
      var more = false;

      ctrl.$validators.dummy = function (modelValue, viewValue) {
        if (more) {
          ctrl.$setDirty();
        }
        more = true;
        return true;
      };        

    }
  };
});

是否可以在没有任何输入元素的指令上使用NgModelController验证？

1 个答案: