AngularJS - Why select drop down doesn't have $event on change

Question

I am newbie to AngularJS. I have a question, why does ng-change doesn't passes the $event?

HTML

<div ng-controller="foo">
    <select ng-model="item" ng-options="opts as opts.name for opts in sels" ng-change="lstViewChange($event)" ng-click="listViewClick($event)"></select>
</div>

Script

var myApp = angular.module('myApp', []);
angular.element(document).ready(function() {
   angular.bootstrap(document, ['myApp']);
});

function foo($scope) {
    $scope.sels = [{id: 1, name: 'a'}, {id: 2, name: 'b'}];

    $scope.lstViewChange = function($event){
        console.log('change', $event); //undefined
    }

    $scope.listViewClick = function($event){
        console.log('click', $event); //object
    }
}

Have a look at this fiddle http://jsfiddle.net/QfZZH/. Click passes a valid $event but change doesn't. Can someone explain this behavior?

Answer 1

Just to state the obvious, the docs say that ngClick will pass the event, but ngChange has no such documentation.

So, what you're asking is why Angular's designers chose to do this? My thought is that ngClick fires as a result of a click, so it make sense that there would be a mouse event associated with the directive firing. ngChange on the other hand is a result of any user action that changes the model, which could be associated with all sorts of events rather than one specific event.