javascript - Angular js 根据条件禁用指令

Question

我有一个表单页面，用于添加和编辑表单。因此，在将数据添加到表单中时，我需要检查输入数据是否重复，因此我创建了一个指令，该指令将检查数据库天气数据是否存在。

<input name="divId" type="text" class="form-control fL w250"   ng-model="divisionData.DivisionID"  ng-disabled="Disabled()" unique-divid required /></div>

在添加新数据时，它工作正常。但在编辑时也使用相同的形式，因此 unique-divid 指令正在运行。我不希望这种情况发生在编辑页面

.directive('uniqueDivid', function($http) {
  var toId;
  return {
    restrict: 'A',
    require: 'ngModel',
    link: function(scope, elem, attr, ctrl) { 
     scope.$watch(attr.ngModel, function(value) {
        if(toId) clearTimeout(toId);
        toId = setTimeout(function(){
          console.log(value);
            $http({
            method  : 'POST',
            url     : 'http://testurl',
            data    : $.param({'DivisionID' : value}), 
            headers : { 'Content-Type': 'application/x-www-form-urlencoded' }  
        })
            .success(function(data) {
                console.log(data);
                if(data.status == 'success'){
                    ctrl.$setValidity('uniqueDivid', true);
                }else if(data.status == 'fail'){
                    ctrl.$setValidity('uniqueDivid', false);
                }
                if (!data.success) {
                } else {
                }
            });


        }, 200);
      })
    }
  }
});

请提出一个解决方案，要么禁用该指令，要么在编辑时停止范围。$watch 函数。

Answer 1

您可以向输入字段添加其他属性来指示其所服务的表单操作(创建/编辑)的类型吗？

例如:

<input name="divId" type="text" class="form-control fL w250" ng-model="divisionData.DivisionID" ng-disabled="Disabled()" unique-divid form-action="edit" required />

如果操作类型与您想要忽略的类型匹配，则只需从链接函数返回即可。

link: function(scope, elem, attr, ctrl) { 
  if (attr.formAction === "edit") return;
  ..
}

如果您不想修改模板， Controller 或作用域中的指示可用于区分新的和现有的divisionData？您可以使用该属性作为从 unique-divid 指令返回的标志:

link: function(scope, elem, attr, ctrl) { 
  if (!scope.divisionData.isNew) return;
  ..
}