ng用异步函数模拟怪异行为

ng-model weird behavior with Asynchronous function

本文关键字:模拟 异步 函数 ng      更新时间:2023-09-26

下面是下拉选择代码:

<select ng-model="filter.area">
    <option value="">Select your location</option>
    <option ng-repeat="area in areaNames" value='{{ area.area_name }}'>{{ area.area_name }}</option>
</select>

在调用Async函数之前,在控制器中设置ng-model

$scope.filter.area = $cookies['filterArea'];
// which evaluated to some value lets say 'Bole'

现在是异步功能:

query.find({
   success: function(results_area) {
     $scope.$apply(function() {
        $scope.areaNames = results_area;
        for (var i = 0; i < $scope.areaNames.length; i++) {
          $scope.areaNames[i].area_name = $scope.areaNames[i].get('name');
        };
      });
   },
   error: function(error) {
      console.log("error in fetching area info....");
    }
   });

ng-model未更新。知道这里出了什么问题吗?

要查看演示,请访问此处:http://peppy-avatar-762.appspot.com/

然后选择"亚的斯亚贝巴"并选择"伯乐"作为区域,然后点击寻找食物!检查左侧的区域过滤器。ng模型没有更新!

如果延迟加载选项,请在option 上使用ng-options而不是ng-repeat

<select data-ng-model="selectedItem" 
        data-ng-options="item for item in items track by item">
</select>

工作程序