AngularJS - text input value not reflecting in scope variable

Question

I have an input text field as :

<input type="text" class="form-control" id="inputValue" name="uservalue" ng-model="inputNumber" ng-required="true" autofocus="true" ng-blur="checkIfValid()"/>

My controller has the ng-blur function as follows:

$scope.checkIfValid = function(){
        console.log("Value is = " + $scope.inputNumber);
}

I have defined - $scope.inputNumber = '';

My console.log shows an empty value even though I input a value in the text field and hit 'Tab' or move on to the next field to invoke the ng-blur function.

What am I doing wrong here? `

Answer 1

Check this

 var app = angular.module("myapp", []); app.controller("myCtrl", ['$scope', function($scope) { $scope.inputNumber="new"; $scope.checkIfValid = function(){ console.log("Value is = " + $scope.inputNumber); } }]); 

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="myapp"> <div ng-controller="myCtrl"> <input type="text" class="form-control" id="inputValue" name="uservalue" ng-model="inputNumber" ng-required="true" autofocus="true" ng-blur="checkIfValid()"/> <h1>{{inputNumber}}</h1> </div> </div>