One straightforward question arises: How can I establish an initial value for my ng-options? The challenge lies in the requirement that the default value must be a specific one, which necessitates a conditional check to determine this particular value.
HTML
<select ng-model="selectedOption1" ng-options="horario for horario in dia.horarios" ng-change="vm.saveInitialSchedule($index, selectedOption1)">
Here is my JSON data:
https://i.sstatic.net/bkRkM.png
For each option, it's essential to verify if the option's value matches valorInicio. If a match is found, that value should be automatically chosen as the default one.
In the previous format, I used:
ng-selected="dia.valorInicio == horario"
And it worked perfectly well.
However, since the 'ng-selected' feature is no longer available.
So, can anyone offer assistance?
Thank you!
//EDIT//
HTML
<ion-view view-title="Change Schedules">
<ion-content>
<div class="list card" ng-repeat="dia in vm.dias">
<div class="item item-divider" align="center">
{{dia.nombre}}
</div>
<div class="list">
<label class="item item-input item-select">
<div class="input-label">
First shift
</div>
<select ng-model="selectedOption1" ng-options="horario for horario in dia.horarios" ng-change="vm.saveInitialSchedule($index, selectedOption1)">
</select>
</label>
<label class="item item-input item-select">
<div class="input-label">
Last shift
</div>
<select>
<option ng-model="selectedOption2" ng-repeat="horario in dia.horarios" ng-change="vm.saveFinalSchedule($index, selectedOption2)" ng-selected="dia.valueEnd == horario" value="{{horario}}">{{horario}}</option>
</select>
</label>
</div>
</div>
<div class="padding-horizontal"><button class="button button-block button-positive" ng-click="vm.saveSchedules()"> Save schedules </button></div>
</ion-content>
</ion-view>
Controller
(function() {
'use strict';
angular
.module('example.changeSchedules')
.controller('ChangeSchedulesController', ChangeSchedulesController);
ChangeSchedulesController.$inject = ['$state', '$scope', 'changeSchedulesService'];
function ChangeSchedulesController($state, $scope, changeSchedulesService ) {
var vm = this;
vm.state = false;
vm.scheduleState = false;
vm.days = [];
vm.errorMessage = '';
vm.loadSchedules = loadSchedules;
vm.saveInitialSchedule = saveInitialSchedule;
vm.saveFinalSchedule = saveFinalSchedule;
vm.initialSchedules = [];
vm.finalSchedules = [];
initialize();
function initialize() {
loadSchedules();
}
function saveInitialSchedule(index){
console.log("indexxxxxx:"+index);
console.log("Option 1 : " + $scope.selectedOption1);
debugger;
}
function loadSchedules() {
vm.state = false;
vm.scheduleState = false;
changeSchedulesService.retrieveComplexSchedules()
.then(function(days) {
vm.days = days;
displayChangeSchedules(true);
})
.catch(function(e){
displayChangeSchedules(false);
vm.errorMessage = e.concat(" Tap to reload.");
});
}
function displayChangeSchedules(state){
if(state == true){
vm.state = true;
}
else{
vm.state = false;
vm.scheduleState = true;
}
}
function saveInitialSchedule(index, time){
vm.initialSchedules[index] = time;
console.log(vm.initialSchedules);
}
function saveFinalSchedule(index, time){
vm.finalSchedules[index] = time;
console.log(vm.finalSchedules);
}
}
})();