I'm trying to create a directive to replace a bunch of identical inputs
(function () {
angular
.module('myModule')
.directive('pageSearchInput', PageSearchInputDirective);
function PageSearchInputDirective() {
return {
restrict: 'E',
require: 'ngModel',
scope: {
ngModel: '=',
ngChange: '&'
},
replace: true,
template:
`<input type="text" ng-model-options="{debounce: 1000}" ng-model="ngModel" ng-change="ngChange()">`
};
}
}());
And here is usage example:
<page-search-input ng-model="keyword" ng-change="someFunction()"></page-search-input>
And in my controller
$scope.keyword = '';
$scope.someFunction = function() {
console.log($scope.keyword);
};
So my problem is that $scope.keyword
is one step behind.
When I type the following
a
ab
abc
Console log gives me
''
a
ab
And if I simply put
<input type="text" ng-model-options="{debounce: 1000}" ng-model="keyword" ng-change="someFunction()">
into my template everything works perfect.
Any ideas, please?