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，也許看看一些角度的教程和例子，並嘗試重寫你的代碼風格。