ng-change not working on a text input


I am new to angular js. In my code there is color picker initialized from a text field. User changes the value of color and I want that color to be reflected as a background of a text in a span. It is not working. What is missing?


<body ng-app="">
   <input type="button" value="set color" ng-click="myStyle={color:'red'}">
   <input type="button" value="clear" ng-click="myStyle={}">
   <input type="text" name="abc" class="color" ng-change="myStyle={color:'green'}">
   <span ng-style="myStyle">Sample Text</span>

Plunker -

However when I change it to ng-click it works.

This question is tagged with angularjs colors angularjs-directive angularjs-ng-change

~ Asked on 2014-09-30 07:20:58

The Best Answer is


ng-change requires ng-model,

<input type="text" name="abc" class="color" ng-model="someName" ng-change="myStyle={color:'green'}">

~ Answered on 2014-09-30 07:27:55


I've got the same issue, my model is binding from another form, I've added ng-change and ng-model and it still doesn't work:

<input type="hidden" id="pdf-url" class="form-control" ng-model="pdfUrl"/>


An input #pdf-url gets data from dropzone (two ways binding), however, ng-change doesn't work in this case. $scope.$watch is a solution for me:

$scope.$watch('pdfUrl', function updatePdfUrl(newPdfUrl, oldPdfUrl) {
  if (newPdfUrl !== oldPdfUrl) {
    // It's updated - Do something you want here.

Hope this help.

~ Answered on 2016-06-30 04:10:50

Most Viewed Questions: