I recently developed a custom directive in AngularJS that utilizes the input type number with min-max and ng-model attributes. I made sure to use an isolated scope for the directive. However, despite setting up a blur event within the directive, I am encountering issues retrieving the ng-model value:
<input my-directive min="5" max="10" ng-model="num" type="number">
myApp.directive('myDirective', function () {
function link($scope, ele, attr) {
$scope.$watch('num', function (value) {
console.log(value);
})
ele.on('blur', function () {
console.log($scope.num, $scope.min, $scope.max);
})
}
return {
restrict : 'A',
scope: {
num: "=ngModel",
min: "=?",
max: "=?"
},
link: link
}
});
output: undefined 5 10
I'm puzzled as to what I might be missing. Any suggestions?