Question

我正在尝试使用angular填充HTML选择。我测试了API，得到了类似的东西：

{"Countries":[{"Id":1,"Name":"Andorra"},{"Id":2,"Name":"France"}]}

HTML如下：

<form id="form" method="post" ng-submit="submit">
  <select ng-model="model.currentCountry" ng-options="country.Id as country.Name for country in model.countries" ng-controller="CountryController">
    <option value="">Country</option>
  </select>
</form>

然后我有JS代码：

var application = angular.module('Application', []);

application.service('CountryService', function ($http) {
  return {
    GetList: function () {
      return $http.get('api/countries');
    }
  }
});

application.controller('CountryController', function CountryController($scope, CountryService) {

  alert("Country Controller");

  $scope.model = {
    currentCountry: '',
    countries: []
  }

  CountryService.GetList()
    .success(function (data, status, headers, config) {
      $scope.model.countries = $scope.model.countries.concat(data)
    })
    .error(function (data, status, headers, config) { });

});

甚至连CountryController中的警报都没有被触发。

知道我错过了什么吗？

Answer 1

在控制器的成功处理程序中，你有......

$scope.model.countries = $scope.model.countries.concat(data)

因此，您从示例JSON中查找Countries对象，将其更改为：

$scope.model.countries = $scope.model.countries.concat(data.Countries)

通过这种方式，您可以将实际的国家/地区数组连接到您的model.countries。

修改，这是一个与

一起使用的示例plnkr

填充选择不触发角度控制器

1 个答案: