There is a particular issue that I just can't figure out.
Within my html code, I have the following:
<select ng-model="$parent.product" ng-options="i.id_product as i.product for i in productsServer">
<option>Select</option>
</select>
And in my controllers:
$rootScope.product = '1';
Upon the initial page load, the first option is automatically selected. However, if I change $rootScope.product = '1'; to $rootScope.product = '3';, the third option is displayed.
Now, when a different value is selected, it is stored in $rootScope.product. But later on, in a certain function, I attempt to reset $rootScope.product back to '1' and it doesn't seem to work.
What am I overlooking here?
P.S. Without $parent.product, the select component does not update the $rootScope.product value.
EDIT: Here is the additional function:
$rootScope.inputData = function() {
setTimeout(function () {
$rootScope.product = '1';
$scope.$apply();
}, 2000);
$state.go('app.grid_settings', {}, {
reload: true
});
The inputData function is triggered by clicking a button.