AngularJs - ng-опции не связываются после вызова ajax

Question

Я пытаюсь изменить выбранный индекс параметров ng после вызова ajax, но он не изменится.

//Html Section...

<select id="fooId" ng-model ="foo.formula"
   ng-options="formulas as name for (formulas, name) in the_formula"></select>

//End Html Section...


//js file...

//get list of formula from server...
TheSource.Get.then(function(response){
    $scope.the_formula = response.the_formula;
});


//do something awesome, then..
//binding data from server...

TheData.Get.then(function(response){
    //binding the data to view...
    //all of the element is binding, except the ng-options part..
    $scope.foo = response; 

    //not working..
    //$scope.formula = response.formulaId //it is return integer ID like (1, 2, 3, etc..)
});

// End js file...

И это данные, которые отправляет мой API.

{ 
   "the_formula":{
     "123":"formula1",
     "124":"formula2"
   }
}

В чем дело? Как автоматически изменить выделение в ng-options?

Answer 1

@reptildarat

Привет,

Я тоже застрял в той же ситуации, когда работал с select и ng-option.:)

Что вы должны будете сделать-

Установите значение "foo.formula" после того, как данные, полученные из вызова ajax, и привязка завершены. Причина - когда рендеринг HTML. Он связывает "foo.formula" в теге выбора. На данный момент нет заполненных пунктов. Через некоторое время элементы заполняются сзади (js), и для этой ng-модели не запускается триггер.

После долгих усилий я нашел это

Пример-

Вот что вам нужно сделать в JS.

   .success(function (data) {  
            $scope.$emit('HideLoading');  
            $scope.departments = data.DepartmentsGetResult;  
            $scope.selectedDepartment = item.DepartmentId;  

Вот мой HTML-

<select   
   data-ng-model="selectedDepartment"   
   data-ng-options="dept.DepartmentId as dept.Title for dept in departments" >  
 </select>  

Надеюсь, это поможет.
Дайте мне знать ваши проблемы.
:)

Answer 2

После http-вызова сделайте $scope.selectedOption = options[0]

Это может быть более конкретным решением при использовании .

      <select ng-model="selectedOption" class="form-control" ng-change="metaTypeSelected(selectedOption)">
    <option 
        ng-selected="{{selectedOption}}" 
        ng-repeat="selectedOption in options track by $index"
        value="{{selectedOption}}">
        {{selectedOption}}
    </option>
</select>

использовать selectedOption в ng-model, ng-repeatа также ng-change