Angular-In指令中，元素驗證始終未定義

Question

我有一個表單，它具有很少的輸入字段。我想在彈出窗口中顯示錯誤消息，當用戶將輸入字段聚焦或單擊提交按鈕時。 我創建了一個將popover屬性添加到輸入字段的指令。因此，當用戶從輸入字段中移出時，我將檢查驗證，如果驗證失敗，則要顯示彈出窗口。但是，當我試圖總是檢查我沒有定義。

有人可以幫助我做到這一點。 我plunker

app.directive("errorTooltip", function($compile, $interpolate, $timeout) { 
    return { 
    scope: true, 
    require: 'ngModel', 
    link: function (scope, element, attr, ctrl) { 
      element.attr('popover-trigger', "'show'"); 
      element.attr('popover-placement', 'top'); 
      element.attr('uib-popover', element.attr("data-info")); 

      var blurred = false; 
      element.on("blur",function(event){ 
      blurred = true; 
      }); 
      scope.$watch(function() { 
      console.log(ctrl.$name.$invalid); //always comes undefined 
      element.triggerHandler('show'); 
      return ctrl.$name.$invalid 
      }, function(invalid) { 
      if (!blurred && invalid) { 
       return 
       } 
      console.log("test") 
       //element.toggleClass('has-error', invalid); 

     }); 


    } 
    }; 
}); 

在此先感謝。

Answer 1

將行：

console.log(ctrl.$name.$invalid); 

有了這個：

console.log(ctrl.$invalid); 

更新plunker here。