Forgive me for this, but I am still learning angularjs.
I am facing an issue with a select control that is populated using the following code:
<select ng-model="limit" data-ng-options="listLimit.name for listLimit in listLimits" data-ng-change="limitChanged()"></select>
After the control is set up, the options are simply 50, 100 & 150.
The problem arises when I try to change the value in the select control. It seems like the limitChanged() function does not recognize the newly selected option. Here is an example:
module.controller('PageController', function ($scope) {
$scope.limit = $scope.listLimits[0]; // $scope.listLimits[0] is essentially {name:50}
$scope.limitChanged = function() {
console.log($scope.limit.name); // This will log 50 (the default value) regardless of the selected option
loadList(); // This function changes the item limit
};
}
However, when I use {{limit}} in the view, it does display the updated value when the select control is changed. I am a bit confused. Can anyone help me understand what I might be doing wrong?