在angularJS中调用ajax后改变视图

Change view after calling ajax in angularJS

本文关键字:改变 视图 ajax 调用 angularJS      更新时间:2023-09-26

我需要angularJS的帮助。我调用ajax如下:

$scope.$watch('value1', function() {
  if ($scope.value1 != null) {
    $http({
      method : 'GET',
      url : 'http://localhost:8080/program1/api/verify?post='+$scope.value1
    }).success(function (result) {                                              
      $scope.data1 = result;      
      console.log("ajax->"+$scope.value2);
    });
  }
});

在我看来,我有以下代码:

<div ng-controller="MainController">
  <select ng-model="data1"
          ng-options="data for data in data1">
    <option value=""></option>
  </select> 
  {{data1}}
</div>

我的问题是下拉菜单在视图中没有改变。有人能帮我一下吗?提前谢谢大家

您的问题是您的ng-optionsng-model使用相同的属性data1

当你选择的值被绑定到ng-model的属性,所以是data1,然而你的ng-options使用data1,所以它被覆盖。

所以基本上你的ng-optionsng-model应该使用你的作用域的两个不同的属性。一个表示选择的值,另一个是填充选项的值数组。参见:http://jsfiddle.net/1uzyoLmr/
<select ng-model="data1"
        ng-options="d for d in data">
    <option value=""></option>
</select> 
{{data1}}

和控制器

$scope.data1;
$scope.data = [10, 11, 23];

文档参考:https://docs.angularjs.org/api/ng/directive/ngOptions