У меня есть угловая директива, которую я создаю с некоторыми элементами управления нумерацией страниц.
<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
.
3 ответа
Вы можете просто проверить значение переменной current
перед разбиением на страницы.
Я предполагаю, что вы используете $watch()
для прослушивания изменения вашей переменной current
.
Код внутри ссылки вашей директивы,
scope.$watch("current", function(newVal, oldVal){
if(angular.isNumber(newVal)){
// your variable is a number
// Do your pagination here
}
});
Возможно, я неправильно понял ваш вопрос. Это обновит модель только при нажатии за пределами ввода
<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;
}
}
ngModelOptions
полезен в таком случае. Вы могли бы написать так
<input ng-model="current" ng-model-options="{ updateOn: 'default', debounce: {'default': 500, 'blur': 0} }" />
Задержать обновление значения до 500 мс по умолчанию и немедленно обновить, если потерял фокус.
На этот вопрос также ответили несколько раз, поэтому Вы должны быть в состоянии найти дополнительную информацию в других вопросах.
ОБНОВИТЬ:
$scope.$watch(
function() {
return $scope.current;
}, function(oldVal, newVal) {
if (!newVal) {
$scope.current = oldVal
}
}
);
Если oldVal
также является нулевым или пустой строкой, вы можете скопировать $scope.current
в другую переменную области (скажем, $scope.savedCurrent
) всякий раз, когда newVal имеет значение, и скопировать его обратно в $scope.current
, если не.
Похожие вопросы
Связанные вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.