angularjs select ng-options延迟更新（联动）

在使用angularjs的ng-options时，在后台更改了scope里对应的数组后，前段的select里的option不会马上更新，而是选择了某项后才会更新

 <label class="item item-input item-select">
    <div class="input-label">
      大类
    </div>
     <select ng-model="selected2" id="test" ng-options="sh.Type1Name for sh in list" ng-change="c2()" >
             <option value="">--请选择--</option>
     </select>
  </label>
  
  
   <label class="item item-input item-select">
    <div class="input-label">
      小类
    </div>
   
   <select ng-model="selected3" ng-options="x.Type2Name for x in list1">
             <option value="">--请选择--</option>
        </select>
  </label>

JS

 $scope.list=function(){
     $.ajax({
                        type:"post",
                      contentType: "application/json; charset=utf-8",
                        async:false,
              url:ip+"/Data/List",
                         dataType:"jsonp",
                         jsonp: 'callback',//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)  
                         data:{},
                       success: function (data) {
                
                      $scope.list = data.list;
                    
                      $scope.c2 = function () {
                      
                          //获取select对象
                      var myselect = document.getElementById('test');
                      //获取选中项的索引
                      var index = myselect.selectedIndex; 
                      var json = data.list;
                      var type1id = json[index-1]["Type1Id"];
                      
                      jQuery.ajax({
                          type:"post",
                          contentType: "application/json; charset=utf-8",
                                async:false,
                                url:ip+"/Data/ListType?Type1Id="+type1id,
                                dataType:"jsonp",
                                jsonp:'callback',
                                data:{},
                                success:function(data){
                                    $scope.list1=data.list;
                                    //强制更新
                                    $scope.$apply();
                                }
                               
                      });
                     
                         
                      };

            
                       }
    
    });
 }

JSON后台返回格式

({"list":[{"Type1No":"01","Type1Name":"市政","Type1Id":"6f9619ff-8b86-d011-b42d-00c04fc964ff"},{"Type1No":"02","Type1Name":"消防","Type1Id":"6f9619ff-8b86-d011-b42d-00c08fc964fe"},{"Type1No":"03","Type1Name":"其它","Type1Id":"6f9619ff-8b86-d011-b42d-00c14fc964ff"}]})

问题分析

---

其实并不是"在更改了select里的选项后才更新"，而是因为响应了sites事件后的数据更新操作被没有被视图得知。因为你的socket实际是个游离在$scope之外的操作，所以双向绑定在这里没有生效。

那为什么"在更改select之后"它却刷新了呢？原因也简单，因为你这次的操作又重新回到了$scope的生命周期之中，所以双向绑定监测到了$scope.options的变化。

解决方法超简单，就是强制通知angular你的数据更新了：

$scope.options = [{name:'aa',id:1},{name:'bb',id:2}];//初始化时候的值
socket.on('sites',function(data){
        $scope.options = data;//socket.io更新该值
        $scope.$apply(); //强制通知
    });

关键点

---

 $scope.$apply(); 

 //默认第一次加载数据
 $scope.list();