角度和JSON交互

Angular and JSON interaction?

本文关键字：交互 JSON      更新时间：2023-09-26

我试图实现一个涉及angular.js和JSON的非常基本的系统，但我无法让它正常工作。我所要做的就是获取JSON文件中某个特定字段的值，并将其吐到页面上。有人明白为什么不起作用吗？它每次都会找到数据库，但我似乎无法访问该对象。

HTML&JS

<html lang="en" ng-app="ngApp">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.16/angular.min.js"></script>
<script>
    var ngApp = angular.module('ngApp', []);
    ngApp.controller('ngCtrl', function($scope, $http){
        $http.get("db.json").success(function(data){
            console.log("Database found");
            $scope.data = data;
        });
    });
</script>
<body ng-controller="ngCtrl">
    <div>Data goes here: {{data.field1}}</div>
</body>
</html>

JSON

[
    {
        "field1":"data1",
        "field2":"data2"
    }
]

我对棱角分明很陌生，所以如果我错过了什么，我不会感到惊讶。

您的json响应是objects的array。因此，您必须使用数组表示法来访问其中的数据

请参阅以下突出显示的更改：

<div>Data goes here: {{data[0].field1}}</div>
//                         ^^^

您可能希望使用ng-repeat循环所有数据

<body ng-controller="ngCtrl">
    <div ng-repeat="item in data">
        <span> Field1 : {{item.field1}}</span>
        <span> Field2 : {{item.field2}}</span>
    </div>
</body>

从第一眼看，返回的json数据似乎是一个对象数组。试试这个

data[0].field1
相关文章：