AngularJs-ng-options在ajax调用后没有绑定 [英] AngularJs - ng-options not binding after ajax call

问题描述

我尝试在ajax调用后更改所选的ng-options索引，但不会更改。

I try to change the selected index of ng-options after ajax call, but it won't change.

//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发送。

And this is the data that send by My API.

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

怎么了？如何自动更改ng-options中的选择？

What's wrong? How To Automatically change selection in ng-options?

推荐答案

@reptildarat

@reptildarat

你好，

当我使用select和ng-option时，我也遇到了同样的情况。 :)

I too was stuck in the same situation when I was working with select and ng-option. :)

你需要做什么 -

设置之后的foo.formula的值从ajax调用和绑定中检索的数据完成。
原因 - 正在呈现Html时。它绑定select标签中的foo.formula。那时没有填充的项目。一段时间后，项目从后面（js）填充，并且没有触发该ng模型的触发器。

Set the value of "foo.formula" after the data in retrieved from the ajax call and binding is done. Reason- When the Html is being rendered. It binds "foo.formula" in the select tag. At that time there is no items populated. After sometime the items are populated from behind (js) and no trigger is fired for that ng-model.

经过多次努力，我发现了这个 -

After a lot of effort I found this-

示例 -

以下是你需要在js中做的事情。

Here is what you need to do in 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>  

希望这会有所帮助。

让我知道您的担忧。

:)

Hope this will help.
Let me know your concerns.
:)

这篇关于AngularJs-ng-options在ajax调用后没有绑定的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！