Изменить вид после вызова ajax в angularJS

Question

Мне нужна помощь с угловымJS. Я называю Аякса следующим образом:

$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); 
    }); 
    } 
}); 

На мой взгляд, у меня есть код folloing:

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

Моя проблема заключается в том, что выпадающий не меняется в представлении. Может ли кто-нибудь мне помочь? Вы заблаговременно

Answer 1

Вы выпускаете ваши ng-options и ng-model и используете этот объект data1.

При выборе значения, выбранное значение привязывается к свойству ng-model так что data1 однако ваш ng-options использует data1 поэтому он получает перезаписаны.

Таким образом, в основном ваши ng-options и ng-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]; 

Docs для справки: https://docs.angularjs.org/api/ng/directive/ngOptions