NG模式是不是错了不允许被触发提示

Question

我在输入字段使用此ng-pattern="/^[0-9]{9}$/"是呈现如下：

<input 
    type="text" 
    id="company_taxId" 
    ng-model="company.taxId" 
    required="required" 
    class="input ng-scope ng-valid-maxlength ng-valid-minlength ng-dirty ng-valid-required ng-invalid ng-invalid-pattern" 
    style="width:485px;" 
    ng-minlength="9" 
    maxlength="9" 
    ng-maxlength="9" 
    ng-pattern="/^[0-9]{9}$/" 
    placeholder="Ej: 458965879" 
    tooltip="Ej: 458965879" 
    wv-def="Ej: 458965879" 
    tooltip-trigger="focus" 
    tooltip-placement="right" 
    wv-cur="" 
    wv-err="Este valor debería ser un número válido." 
    wv-req="Este campo es requerido" 
    wv-min="Este valor debería tener exactamente 9 caracteres" 
    wv-max="Este valor debería tener exactamente 9 caracteres" 
> 

如果模式失败，例如，如果我写的信，而不是编号为“Este valordeberíaser unnúmeroválido”的消息应该触发，但它不起作用，我无法找到问题所在。模式是否错误？那里有什么问题？

这是处理提示触发的指令：

app.directive('validated', function() { 
    return { 
     restrict: 'A', 
     link: function(scope, element, attrs) { 

      element.keyup(function(){ 
       parent = $('.tooltip'); 
       target = parent.find('.tooltip-inner'); 
       if(element.hasClass('ng-invalid-required')){ 
        target.html(attrs.wvReq); 
        attrs.wvCur = attrs.wvReq; 
        parent.addClass('error'); 
       } 
       else if(element.hasClass('ng-invalid-email')){ 
        target.html(attrs.wvEml); 
        attrs.wvCur = attrs.wvEml; 
        parent.addClass('error'); 
       } 
       else if (element.hasClass('ng-invalid-name-exists')) { 
        target.html(attrs.wvNam); 
        attrs.wvCur = attrs.wvNam; 
        parent.addClass('error'); 
       } 
       else if(element.hasClass('ng-invalid-minlength')){ 
        target.html(attrs.wvMin); 
        attrs.wvCur = attrs.wvMin; 
        parent.addClass('error'); 
       } 
       else if(element.hasClass('ng-invalid-maxlength')){ 
        target.html(attrs.wvMax); 
        attrs.wvCur = attrs.wvMax; 
        parent.addClass('error'); 
       } 
       else if(element.hasClass('ng-invalid')){ 
        target.html(attrs.wvErr); 
        attrs.wvCur = attrs.wvErr; 
        parent.addClass('error'); 
       } 
       else{ 
        target.html(attrs.wvDef); 
        attrs.wvCur = attrs.wvDef; 
        parent.removeClass('error');  
       } 
      }); 

      element.focus(function(){ 
       //attrs.title = attrs.wvCur; 

       setTimeout(function(){ 
        parent = $('.tooltip'); 
        target = parent.find('.tooltip-inner'); 
        target.html((attrs.wvCur != "" ? attrs.wvCur : attrs.wvDef)); 
        if(attrs.wvCur != attrs.wvDef && attrs.wvCur != "") 
         parent.addClass('error'); 
       },5); 
      }); 
     } 
    }; 
}); 

PS：我使用Twitter的引导工具提示：本

Answer 1

的ng-model属性是不可选的（可以看出here）。您确实分配了它，但它需要实际存在于范围中。因此，您需要提供带有控制器的示波器以及在ng-model中引用的有效变量。

这是一个工作example。您可以看到，如果您删除或以其他方式使分配给ng-model的范围变量无效，它将停止工作。

这将解决这个问题，但总的来说，我建议你实现你正在试图做的更接近角度的文档中显示的内容。

编辑：这里是你的代码的工作版本：demo

但是，你不能设置使用attr像你正在尝试做的元素属性。你必须使用element。它没有tooltip元素（你可以添加它）。再次，我强烈建议你看看here，也许看看一些角度的教程和例子，并尝试重写你的代码风格。