指令

Question

我有一个角度指令，我正在使用一些分页控件构建。

<div>
    <!-- table logic here -->
</div>
<div>
    <button bg-click="current=prevPage(current);">Prev</button>
    <input ng-model="current" />
    /{{pages}}
    <button bg-click="current=nextPage(current);">Next</button>
</div>

它工作正常，但当然在更改input。

中的值时

在您输入新值之前，它还会在删除期间拾取空字符串。

在实际触发current值的变化之前，有没有办法在指令中嗅出它。

Answer 1

我可能理解你的错误。 只有在输入外部单击

时，才会更新模型

<input ng-model="current" ng-model-options="{updateOn: 'blur'}" />

或者换句话说，当您更改输入值时，它会调用一个函数来测试新值是否有效并将其设置为当前值。

Html：

 <div>
     <button bg-click="current=prevPage(current);">Prev</button>
     <input type="number" ng-model="currentInput" ng-change="changeCurrent()" />
     /{{pages}}
     <button bg-click="current=nextPage(current);">Next</button>
 </div>

控制器：

 $scope.currentInput = $scope.current; 
 $scope.changeCurrent = function(){
   if ($scope.currentInput!=""){
    $scope.current = $scope.currentInput;
   }
 }

Answer 2

在这种情况下，

ngModelOptions很有用。你可以写这样的

<input ng-model="current" ng-model-options="{ updateOn: 'default', debounce: {'default': 500, 'blur': 0} }" /> 

将更新值延迟到默认的500ms模型，并在失去焦点时立即更新。

这个问题也已经回答several times，所以你应该能够在其他问题中找到更多信息。

更新：

$scope.$watch(
   function() {
      return $scope.current;
   }, function(oldVal, newVal) {
      if (!newVal) {
         $scope.current = oldVal
      }
   }
);

如果oldVal也为null或为空字符串，则只要newVal有值，就可以将$scope.current复制到另一个范围变量（比如$scope.savedCurrent）并将其复制回{{1如果没有。

Answer 3

您可以在进行分页之前检查变量current的值。

我假设您使用$watch()来收听变量current的更改。

指令链接中的代码，

scope.$watch("current", function(newVal, oldVal){
    if(angular.isNumber(newVal)){
        // your variable is a number
        // Do your pagination here
    }
});