Ng-Change-2

 
In this example, we have an array named courses with the course value Angular, Jquery and Bootstrap. The default course is Angular. When you select any course from the select list the selected course is display below it and with the course the count is display that how many times you change the course or we can say that how many times you change the value of select list.
 
 
 
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Welcome to LearnKode - A code learning platform</title> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.2/angular.min.js"></script> </head> <body ng-app="changeExample"> <div ng-controller="ExampleController"> <div class="container"> <div class="col-md-3 well" ng-init="count=0"> Courses: <select ng-change="ngChangeCount()" class="form-control" ng-model="course" ng-options="cr.course as cr.course for cr in courses"></select> <pre> ({{course}}) ng-Change {{count}} </pre> </div> </div> </div> <script> var app = angular.module("changeExample", []); app.controller('ExampleController', ['$scope', function ($scope) { $scope.course = "Angular"; $scope.courses = [{ course: "Angular" }, { course: "JQuery" }, { course: "Bootstrap" }]; $scope.ngChangeCount = function () { $scope.count = $scope.count + 1; } }]); </script> </body> </html>
Output