Question

我正在编写一个验证指令，它接受表单中元素的名称，并根据元素的值打印错误消息。

  <form name="form" >
    <input type="text" name="inp" ng-model="myval" ng-minlength="3">
    <oversee watched="form.inp">
  </form>

指令：

directive("oversee",function () {
  return {
    restrict: 'E',
    scope: {
      watched: '='
    },
    template: '<div ng-show="watched.$invalid">Error</div>',
    link: function (scope, elm) {
      console.log(scope.watched);
    }
  };
}

这就是事情。我想更改错误消息以反映它正在观看的input元素的当前长度。（就像Stackoverflow在评论中所做的那样）

5 more to go...

所以我必须绑定到元素并在每个keyup

上获取它的值

注意 - 我无法使用{{myval.length}}，因为在表单/输入无效时模型未更新。

希望我明白我的问题。

谢谢！

Answer 1

这是一个有效的example，您可以使用$ viewValue而不是model 注意：您还需要处理表单错误消息

angular.module("angtemp", [])
.controller("first", firstCtrl)
.directive("oversee",function () {
  var LIMIT = 20;
  return {
    restrict: 'E',
    scope: {
      watched: '=',
      val: '='
    },
    template: '<div ng-show="countToType">{{countToType}} more to go...</div>',
    link: function (scope, elm) {      
      scope.$watch('val',function(newVal,oldVal){      
        if(!newVal) return;
        scope.countToType = LIMIT-newVal.length;

      });
    }
  };
});

如何绑定到指令中另一个元素的`keydown`

1 个答案: