Question

所以我设法让我的脚本通过$ http.get检索一些JSON数据，并在Object Form中获取我的JSON数据。但是，我无法使用数组中的值。

这是我的AppCtrl部分（AngularJS）

app.controller('AppCtrl', function($scope,$http) {


$scope.data = [];
$scope.submit = function() {

var link = 'http://www.mywebsite.com/api.asp';
$http.get(link).then(function(response) {
    $scope.data = response.data;
    console.log($scope.data);
});
};
});

这是HTML位

<form ng-submit="submit()">
      <input class="button button-block button-positive" type="submit" name="submit" value="Submit To Server">
    </form>
    <div class="card">
        <li ng-repeat="userdata in data">
          Username : {{userdata.username}}
          Age : {{userdata.age}}
        </li>
    </div>

尽管我已经检索了json数据，我无法检索它。我猜这与我有什么关系，不称它为正确？提前谢谢。

更新：console.log（$ scope.data）返回

“0 925121 log [object Object]”

我试图在response.data上运行JSON.stringify，现在我得到一个不同的console.Log结果和一个新的错误。

console.log将JSON信息作为

返回

{ “数据”：[{ “ID”：1， “年龄”： “24”， “用户名”： “hidir”}，{ “ID”：2 “年龄”： “51”，“用户名“：”ibrahim“}]}

错误如下，这表明我在数组中有重复的值，看起来不像它。：

"Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: userdata in data, Duplicate key: string:a, Duplicate value: a
http://errors.angularjs.org/1.5.3/ngRepeat/dupes?p0=userdata%20in%20data&p1=string%3Aa&p2=a

“

Answer 1

你能试试吗？

app.controller('AppCtrl', function($scope,$http) {
    $scope.name = null;
    $scope.submit = function() {
        var link = 'http://www.mywebsite.com/api.asp';
        $http.get(link).then(function(response) {
            $scope.data = response.data;
            if(!$scope.$$phase) {
                //$digest or $apply
                $scope.$apply();
            }
        });
    };
});

Answer 2

为什么不在$ http调用之后使用成功函数，如下所示

$http.get(link).success(function(response) {
    console.log(response);
});
};

Answer 3

尝试使用JSON.stringify（response.data）;

Answer 4

使用此

$http({
  url : link,
  method : "GET",
  headers: {
      'Content-Type': 'applcation/json'
     }
}).then(function(response) {
    console.log(response);
    $scope.data = angular.fromJson(response.data);
    console.log($scope.data);
});

Answer 5

感谢@Abhinav的代码，我发现问题出在我的JSON格式上。我希望有人可以在这里更好地解释它，以便将来参考，因为我不够精通，无法详细解释。

*第一个不起作用的JSON格式

{{userdata[0].username}}

对于上面的代码，只有在我用ng-repeat调用它时它才有效。使用具有此格式的[{"ID":1,"age":"24","username":"hidir"},{"ID":2,"age":"51","username":"ibrahim"}]将失败。

数组表格（为离子工作）

ng-repeat

public static void main(String[] args) { String s1 = "1, 2, 3"; String s2 = "a, b, c"; Map<String, String> m = new HashMap<String, String>(); String s1List [] = s1.split(","); String s2List [] = s2.split(","); for (int i = 0; i < s1List.length && i < s2List.length; i++) { m.put(s1List[i].trim(), s2List[i].trim()); } System.out.println(m); }适用于第二种格式。

无法显示HTML上收到的JSON数据

5 个答案: