angularjs - $scope variable does not align with two $http.get requests -


i have following setup:

<div class="row" ng-repeat="hlos in hloss">     <label for="entry_hlo_{[{ $index }]}" class="control-label"><span ng-if="$first">hlos's</span></label>     <button class="entry_remove_button">remove</button>     <select id="entry_hlo_{[{ $index }]}" class="hlos" name="hlos_{[{ $index }]}" ng-model="hlos_models[$index]" ng-options="hlosa hlosa in hlos track hlosa"></select> </div> 

(please excuse awful variable names, im playing around language atm).

backendapp.controller('featurecontroller', function ($scope, $http) {     // ...     $http.get('/features/1/').success(function(data) {         $scope.hlos_models = {};         $scope.hlos_models[0] = data['hlos']; // when [0] assign here, not work     });     // ...     $http.get('/hloss/').success(function(data) {         // dummy data         $scope.hloss[["mn","la"], ["mn","au"];         $scope.hlos_models[0] = "mn"; // when [0] assign here works      } 

i have 2 sections above in js commented. why when pre-assign ng-model (the selected field) not generate , instead puts ? option field. when move statement down though seems work...i imagine of js get's set , generated before rest of template renders (my js files in <head>).

im not sure models do, try this:

backendapp.controller('featurecontroller', function ($scope, $http) { // ...  // dummy data $scope.hloss[["mn","la"], ["mn","au"]; $scope.hlos_models = []; // initialize, have object, can add it.  $http.get('/features/1/').success(function(data) {     $scope.hlos_models.push(data['hlos']); // push data when }); // ... $http.get('/hloss/').success(function(data) {      $scope.hlos_models.push("mn"); // push data when } 

explanation: want assign data when receive it, calls may take longer others , asynchronous... hence can arrive in different order.

<div class="row" ng-repeat="(key, hlos) in hloss"> <label for="entry_hlo_{[{ $index }]}" class="control-label"><span ng-if="$first">hlos's</span></label> <button class="entry_remove_button">remove</button> <select id="entry_hlo_{[{ $index }]}" class="hlos" name="hlos_{[{ $index }]}" ng-model="hlos_models[key]" ng-options="hlosa hlosa in hlos track hlosa"></select> 


Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -