AngularJS中如何用表达式而非正则为输入框设置setValidity有效性

我完全懂你的需求——当要处理复杂函数逻辑时，正则表达式根本顶不住，直接用表达式控制输入框有效性才是灵活的解决方案。你试过的第三方库没生效没关系，AngularJS本身就提供了原生实现方式，靠谱又省心。

下面给你两个实用方案，按推荐程度排序：

方案一：自定义验证指令（最符合AngularJS设计模式） #

这种方式能把验证逻辑封装成可复用的指令，完美适配复杂表达式或函数逻辑。

步骤1：创建自定义指令 #

angular.module('yourAppName').directive('validExpression', function() {
  return {
    require: 'ngModel', // 依赖ngModel控制器
    scope: {
      validExpression: '&' // 以函数形式接收外部表达式
    },
    link: function(scope, element, attrs, ngModel) {
      // 添加自定义验证器
      ngModel.$validators.customExpression = function(modelValue, viewValue) {
        // 取输入框当前值（兼容model值和视图值，避免空值问题）
        var currentValue = modelValue || viewValue;
        // 执行传入的表达式，把当前值传给表达式使用
        return scope.validExpression({$value: currentValue});
      };
    }
  };
});

步骤2：在HTML中使用 #

你可以直接写简单表达式，也可以调用控制器里的复杂函数：

<!-- 简单表达式示例 -->
<input ng-model="number" required valid-expression="number / 2 > 14">

<!-- 复杂函数逻辑示例 -->
<input ng-model="userInput" required valid-expression="validateComplexLogic($value)">

如果用复杂函数，记得在控制器里定义：

$scope.validateComplexLogic = function(inputValue) {
  // 这里写你的复杂逻辑，比如调用服务、多条件嵌套判断等
  let isValid = false;
  // 示例逻辑：输入值大于10且是偶数，同时满足某个业务规则
  if (inputValue > 10 && inputValue % 2 === 0) {
    isValid = true;
  }
  return isValid;
};

方案二：手动调用$setValidity（临时场景快速实现） #

如果只是单个输入框需要临时处理，也可以直接在控制器里通过ngModel控制器手动设置有效性：

HTML部分 #

<input ng-model="number" required ng-change="checkInputValidity()">

控制器部分 #

$scope.checkInputValidity = function() {
  // 获取输入框的ngModel控制器
  const inputElement = angular.element(document.querySelector('input[ng-model="number"]'));
  const ngModelCtrl = inputElement.controller('ngModel');
  
  // 执行你的验证逻辑
  const isValid = $scope.number / 2 > 14;
  
  // 设置有效性，第一个参数是验证规则名称，第二个是是否有效
  ngModelCtrl.$setValidity('customRule', isValid);
};

为什么第三方库没生效？ #

大概率是版本不兼容（比如你的AngularJS版本和库要求的版本不匹配），或者配置时没正确绑定作用域或表达式。相比之下，原生方案不需要额外依赖，稳定性更高，也更容易调试。

内容的提问来源于stack exchange，提问作者Konrad Straszewski