I have a problem when using ng-options alongside ng-change ( I cannot use ng-repeat - the form is printed by a engine that automaticaly print the and )
I have two binded input ( let's say Number and Selections ), both triggering a function on change.
ng-options set the data with an array of object with an Id and a Max and Min attribute.
<input ng-model="Number" ng-change="foo()"/>
<select ng-model="Selection" ng-options="disable when (item.max<Number || item.min > Number ) for item in datas" ng-change="foo()"/>
the selectable datas in the select is disabled depending on the Number model, some being selectable only if Number is in their range ( an attribute in item ; item.maxRange; item.minRange )
$scope.foo=function(){
console.log("Foo Fighter on the roll !");
}
when changing the data of both input on the web page, foo() get called once for each, as normal But if I start by selection an Item ( with ,let's say a Max value of 35 ), then enter a Number outside of the selected option ( let's say 50 ) the foo() function get called twice ( once for the Number change and once because the Item get unselected as it get disabled ). Is there a way to prevent that second foo() call when the item get disabled ?
I already tried ng-model-options:{updateOn: "blur"} and it stops both foo() on manual change and disabling for the select .
I intend to do some page modification for each foo() call, and it looks bugged if the function get called twice after inputing text once only.
I have found an (evil) solution By evil I mean it is not THE perfect solution but some kind of ditry workaround I've decided to put a timer inside foo(), as the ng-change are fired simultaneously. That timer will prevent the call, and reset on each call. THus when both ng-change will launch , foo() shall be called only once ! Still, the issue is still there, it is just a weird workaround