AngularUI Typeaheadはng-blur関数を2回トリガーします

Question

角度ui先読み（https://angular-ui.github.io/bootstrap/）フィールドを検証しようとしています。私の問題は、私の検証機能がぼかしでトリガされますが、ドロップダウンからオプションを選択する行為はぼやけとしてカウントされるため、私の関数はドロップダウンから選択してからフィールドを離れるときに2回トリガします。

ユーザーが必要なフィールドを選択する前に不完全フィールドを検証しているため、初めてエラーが発生します。その後、再びトリガし、実際にフィールドを離れるときに検証を終了します。

ドロップダウンからの選択には妥当性検査をスキップしたいので、ユーザーがフィールドから完全に離れると妥当性を確認するだけです。私はtypeahead-on-selectを使って関数を実行しようとしましたが、期待した通りに動作しませんでした。私はそれが別のものの使用だと思っていますが、間違っているかどうか教えてください。

検証は、フィールドの値が負荷に検索されたリストにあるものと一致するかどうかを確認するためにチェックされています。ここでは

$scope.validateNumber = function() { 
       for(var i = 0; i < $scope.myList.length; i++) { 
        console.log($scope.myForm.mynumber.$viewValue); 
        console.log($scope.myList[i].myfield); 
        if ($scope.myForm.mynumber.$viewValue !== $scope.myList[i].CustNo) { 
         console.log('they do NOT match!'); 

         $scope.myForm.mynumber.$setValidity("valid", false); 

        } 
        else{ 
         console.log('they do match!'); 
         $scope.myForm.mynumber.$setValidity("valid", true); 
         break; 
        } 
       } 
      }; 

は先行入力用のテンプレートです。ご覧のとおり、ng-blurを使って上記の関数を呼び出します。モデルの変更に合わせて更新する必要があるため、先読みは機能しないため、ng-model-optionsをぼかしで使用することはできません。

      <input othervalidationdirective 
          type="text" 
          class="form-control input-sm" 
          id="mynumber" 
          name="mynumber" 
          ng-model="myinfo.myfield" 
          ng-change="otherfield = null" 
          ng-blur="validateNumber()" 
          uib-typeahead="option as option.MyValue for option in myList | filter:$viewValue | limitTo:8" 
          typeahead-template-url="/tpl.html" 
          typeahead-loading="loading" 
          typeahead-on-select="onSelect($item, 10)" 
          typeahead-min-length="2" 
          typeahead-no-results="noResults" 
          required> 

Answer 1

onBlur機能にタイムアウトを追加します。

function onBlurFunction(){ 
    $timeout(function(){ 
    //some code 
    }, 300); 
};