angularjsangularjs-ng-change

ng-change is not working initially on page loading but after refreshing page it works fine


Here is the code I am facing problem with:

<input type="text" data-ng-model="TODATE" data-ng-change="setTdate()" name="date" class="form-control datepicker" id="todate"  data-date-container="#cal"  data-provide="datepicker" data-date-format="mm-dd-yyyy" placeholder="mm-dd-yyyy"   /> 

code in controller:

$scope.setTdate = setTdate;
    function setTdate() 
   { 
     alert("working"); 
   }

I am using input type as text for bootstrap datepicker, and wants to call a function on selecting a date. The ng-change event is not working when the page initially loads but as i refresh the page it works fine. There is no warning or error on debug.


Solution

  • Have a look. I think it's working fine without refreshing the page.

    <!DOCTYPE html>
    <html>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
    <body ng-app="myApp">
    <div ng-controller="myCtrl">
      <input type="date" ng-change="myFunc()" ng-model="myValue" />
      <p>ng-change triggered {{count}} times.</p>
    </div>
    
    <script>
      angular.module('myApp', [])
        .controller('myCtrl', ['$scope', function($scope) {
          $scope.count = 0;
          $scope.myFunc = function() {
            $scope.count++;
          };
        }]);
    </script>
    </body>
    </html>