AngularJS，我从服务器获取对象数组，我无法在 UI 中获取它答案

【问题标题】：AngularJS,Iam getting Array of Objects from server,iam unable to fetch it in UIAngularJS，我从服务器获取对象数组，我无法在 UI 中获取它
【发布时间】：2018-02-14 14:13:48
【问题描述】：

我正在从服务器获取对象数组作为 Json，当我试图从 HTML 中访问我的服务 URI 时，我在我的控制台中得到低于数组。"angular.js:13920

Error: [$resource:badcfg] http://errors.angularjs.org/1.5.8/$resource/badcfg?p0=get&p1=object&p2=array&p3=GET&p4=%2Fagtools%2FfetchStates"

  <select class="form-control topMarginForRegister"  ng-
     model="LoginDetails.state" ng-click="getStatesData();">
     <option>Select state</option>
     <option ng-repeat="" value="{{state}}">{{state}}</option></select>

StateController.JS

 (function() {
        function loginModalController($scope, LOGIN_CONSTANTS, loginFactory) {
          $scope.getStatesData = function() {
            loginFactory.getStatesData($scope.state).then(function(response) {
                console.log("success");
              })
              .catch(function(error) {
                console.log("error");
              });
          };
        })();

LoginFactory.JS

 (function() {
    function loginFactory($q, LOGIN_CONSTANTS, $resource) {
      function getStatesData(state) {
        var stateData = $resource(LOGIN_CONSTANTS.FETCH_STATES_URL); //my service URL
        var defered = $q.defer();
        stateData.get(
          function(response) {
            defered.resolve(response);
          },
          function(error) {
            defered.reject(error);
          });
        return defered.promise;
      };
    })();

我正在从服务器获取 JSON：

  [
    {
     "city":["ABBE","ADAM"],
     "state":"ALBAMA",
     "country":"US"
    },

    {
     "city":["ABDE","JODA"],
     "state":"ALAKA",
     "country":"US"
    }
    ]

请大家帮帮我，我该如何清除该错误，以便我从服务器获取数据。我试过 $Resource.query 仍然无法获取

【问题讨论】：

参考这个stackoverflow.com/questions/13269882/…

标签： javascript angularjs json

【解决方案1】：

正如错误所写，您正在尝试解析 Array 而不是 Object。理想情况下，这应该已通过 $resource.query 修复，但您尝试过它并不起作用。

那么我的建议是将您的响应从数组更改为对象。我不确定你的情况是否可行。

{
  "countryData": [
    {
      "city": [
        "ABBE",
        "ADAM"
      ],
      "state": "ALBAMA",
      "country": "US"
    },
    {
      "city": [
        "ABDE",
        "JODA"
      ],
      "state": "ALAKA",
      "country": "US"
    }
  ]
}

【讨论】：

【解决方案2】：

工作演示

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

myApp.controller('MyCtrl', function($scope) {
    $scope.data = [
    {
     "city":["ABBE","ADAM"],
     "state":"ALBAMA",
     "country":"US"
    },

    {
     "city":["ABDE","JODA"],
     "state":"ALAKA",
     "country":"US"
    }
    ];
});

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="MyCtrl">
  <select name="state" ng-model="state">
      <option>Select state</option>
     <option ng-repeat="details in data" value="{{details.state}}">{{details.state}}</option></select>
</div>
</body>
</html>

【讨论】：