Asynchronous function doesn't set default value of select use ng-option


#1

Hi guys! I have some trouble with set default value of a select with ng-model when the ng-options is already populated. The flow is this:

  • i contact the server to get my data that contains a field: linguaMadre

  • if linguaMadre have some value i assign the value from the server to my variable

  • while the information from server are received i set the array of statics list of languages.
    At the end, the list is correctly populated, but my default value is not defined. Someone could help me?
    My code is this:

    var recuperoInformazioni = function(){
    vm.user = currUtils.formatUserData(storage.getObject(dbKey.KEY_USER_DATA));
    curriculum = storage.getObject(dbKey.KEY_CURRICULUM);
    vm.curriculum = storage.getObject(dbKey.KEY_CURRICULUM);
    // When the code is here the ng-model doesn’t update the view, so i have the select on an empty value.
    if(curriculum.linguaMadre != undefined && curriculum.linguaMadre != “”){
    vm.linguaMadre = curriculum.linguaMadre;
    }else{
    vm.linguaMadre = currConst.LANGUAGES_LIST[35];
    }

      $ionicLoading.hide();
    

    };

    var sistemaVerificaEsistenzaDati = function(isFirstCycle){
    var userId = storage.getObjectElement(dbKey.KEY_USER_DATA, “_id”);
    // contatto il server per recuperare il curriculum
    Curriculum.get(userId)
    .success(function(data){
    // il curriculum esiste e lo confronto con la versione della local storage
    switch(currUtils.compareCurriculumFromServerWithDb(data)){
    case currConst.STATUS_CV_UPDATE:
    // I dati sono già aggiornati
    if(isFirstCycle) recuperoInformazioni();
    break;
    case currConst.STATUS_CV_NOT_UPDATE: case currConst.STATUS_CV_NOT_EXIST:
    // I dati su local storage non sono aggiorni, quindi li aggiorno con quelli del server
    storage.saveObject(dbKey.KEY_CURRICULUM, data);
    if(isFirstCycle) recuperoInformazioni();
    if(!isFirstCycle && !appOnPause) toast.show(“Dati sincronizzati con il server.”, “short”, “bottom”);
    break;
    }
    })
    .error(function(error){
    // codice errore 001 = curriculum non esiste su server
    // se il curriculum su server non esiste verifico se esiste su local storage
    switch(error.code){
    case “001”:
    if(storage.exist(dbKey.KEY_CURRICULUM)){
    // I dati su server non esistono, recupero i dati da locale e li spedisco al server
    Curriculum.create(storage.getObject(dbKey.KEY_CURRICULUM))
    .success(function(result){
    // toast.show(“Dati sincronizzati con il server.”, “short”, “bottom”);
    })
    .error(function(result){
    // toast.show(“Il dispositivo ha tentato di salvare i dati online, ma la connessione al server è fallita.”, “long”, “bottom”);
    })
    .finally(function(result){
    recuperoInformazioni();
    });
    }else{
    curriculum = Curriculum.newCV();
    curriculum.userId = userId;
    curriculum.lastModified = new Date();
    storage.saveObject(dbKey.KEY_CURRICULUM, curriculum);
    Curriculum.create(curriculum)
    .success(function(result){
    // toast.show(“Dati sincronizzati con il server.”, “short”, “bottom”);
    })
    .error(function(result){
    // toast.show(“Il dispositivo ha tentato di salvare i dati online, ma la connessione al server è fallita.”, “long”, “bottom”);
    })
    .finally(function(result){
    recuperoInformazioni();
    });
    }
    break;
    default:
    // toast.show(“Si è verifiato un errore imprevisto, la connessione al server è fallita.”, “long”, “bottom”);
    break;
    }
    });
    }

    var verificaEsistenzaDati = function(){
    $ionicLoading.show({
    content: ‘Caricamento’,
    animation: ‘fade-in’,
    showBackdrop: true,
    maxWidth: 200,
    showDelay: 0
    });
    var userId = storage.getObjectElement(dbKey.KEY_USER_DATA, “_id”);
    var isFirstCycle = true;
    sistemaVerificaEsistenzaDati(isFirstCycle);
    }

    vm.listaLingue = currConst.LANGUAGES_LIST; // constants get from other file - if i set some value under this line, the ng-model set the default value. (example: vm.linguaMadre = “Inglese”; - inside the select in the view the start value will be "Inglese"
    the HTML code is this:

cuc is the alias of the controller.
I’ve tryed to solve this problem using “$scope.$apply()” at the end of the server callback. But it trhow an error.


#2

Are you sure that the cuc.linguaMadre contains a valid value when your view loads and it is equals to one of your options? Have a look at this Pluker:


#3

Thanks @juliosampaio for the reply. Yes i verify using a console log and the value change inside cuc.linguaMadre .
I’ve already seen this example in Angular.js tutorial, and work fine outside an asynchronous function.
But for set the value of select i need to wait the function ends. After that i’ve my value from the server and i put into cuc.linguaMadre. When i change the value it’s seem that the view doesn’t notice that the ng-model is changed and the view is not update.


#4

I’ve changed the previous plunker, faking an async request. Is your code something like this?

If you could post your code, would be easier to help you figure that out.


#5

Yes… is something like that. The main difference is that when the controller is loaded run the asynchronous function (call to the server) and in the meantime execute the part when i fill up my array for the select.
The code is in my post. The server call start at:

Curriculum.get(userId)
        .success(function(data){ .... }

when the callback come, it doesn’t matter what is the result, because finally i call the function recuperoInformazioni() that take the information (just saved) from local storage and set my view model varible.

and this part of code:

vm.listaLingue = currConst.LANGUAGES_LIST; // constants get from other file - if i set some value under this line, the ng-model set the default value. (example: vm.linguaMadre = "Inglese"; - inside the select in the view the start value will be "Inglese"

get a static array from one of my class service and set the value of visual model variable.