Javascript 读取AngularJS中的JSON文件时出错_Javascript_Angularjs_Json

Javascript 读取AngularJS中的JSON文件时出错

javascript angularjs json

Javascript 读取AngularJS中的JSON文件时出错,javascript,angularjs,json,Javascript,Angularjs,Json,我正在尝试使用$http.get读取AngularJS中的json文件，并在浏览器控制台中获得一些错误普朗克：这是我的密码 Javascript:- var jayApp = angular.module('jayApp', []); jayApp.controller('jayController', function($scope, $http){ $scope.entities = {}; $http.get("test.json").success(

我正在尝试使用$http.get读取AngularJS中的json文件，并在浏览器控制台中获得一些错误

普朗克：

这是我的密码

Javascript:-

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

jayApp.controller('jayController', function($scope, $http){

  $scope.entities = {};

    $http.get("test.json").success(
        function(data, status, headers, config) {
            $scope.entities = data;
        }
    );
})

HTML

    <!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap@3.3.5" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
    <link data-require="bootstrap@3.3.5" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootswatch/3.3.5/cosmo/bootstrap.min.css" />
    <link data-require="bootstrap@3.3.5" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" />

    <script data-require="jquery@1.11.3" data-semver="1.11.3" src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
    <script data-require="bootstrap@3.3.5" data-semver="3.3.5" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
    <script data-require="angular.js@1.4.7" data-semver="1.4.7" src="https://code.angularjs.org/1.4.7/angular.js"></script>

    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
  </head>

  <body ng-app='jayApp' ng-controller='jayController'>
    <h1>Read Json from file </h1>

    Data : {{entities}}
  </body>

</html>

你的普朗克有两个问题。首先，JSON文件的路径错误，导致出现

。删除前导的

修复了该问题

根本问题是您的

JSON

无效

应该是

{
  "name":"jay",
  "city":"Tanjore"
}

您有单引号（'），但需要使用双引号（“）。

无效的JSON…应该是：

{
  "name":"jay",
  "city":"Tanjore"
}

另外，在Plunk中，您调用了错误的位置（去掉/before test.json）

$http.get（“test.json”）.success（…

这是您的json的问题，您需要将文件路径放在不带“/”的位置

JSON:

{
  "name":"jay",
  "city":"Tanjore"
}

$http.get("test.json").success(
    function(data, status, headers, config) {
      console.log(data);
        $scope.entities = data;
    }
);

代码：

{
  "name":"jay",
  "city":"Tanjore"
}

$http.get("test.json").success(
    function(data, status, headers, config) {
      console.log(data);
        $scope.entities = data;
    }
);

以下是最新的

正如我在json文件中看到的，您有一些语法错误，这是您的第一个主要错误，因此解释器无法读取json数据。答：我刚刚在您的

**键**

中添加了双引号，并且 B.我将您所有的json对象封装在卷曲的brakets中

**{}**

你不能解析一个已经是json对象的文件，当你对一个json文件进行字符串化时，你可以解析它。因此，我删除了“parse word”，并将其保留如下：

$http.get("test.json").success( function(data, status, headers, config) { $scope.entities =data; } );

修复了plunker示例：
我没有在你所有的键上加双引号，因为它们太多了，但这足以理解你的错误。
希望有助于好运。
错误是什么？@jcubic谢谢我更新了错误。你可以用它来验证你的JOSNMany谢谢你能检查这个链接它是一个不同的json吗？非常感谢你能检查这个链接它是一个不同的json吗？这个json有问题吗？这个json是从我们的应用程序生成的。@Jay正在查看控制台不，不是。如果在大多数浏览器中按
f12
，它将为您回答大多数问题。试图解析它时，它会引发异常。通过一个实例运行它也会失败。查看它，您是否从控制台中提取了它？它看起来已经被解析了。JSON是一个原始字符串，它描述了一个JS对象。属性和有些值需要用双引号括起来（“）@Jay我认为您在理解JSON时遇到了问题。我建议您仔细阅读一下。首先，在
http
success中，您不需要手动解析响应。在本例中，Angular会这样做。其次，您所有的属性名称都需要用双引号括起来，任何字符串值也需要用双引号括起来。最后，您缺少一对卷曲的字符串enitre JSON周围的大括号（{}）。您有一个
entityPropertyTypes:[]
定义对象属性，但是您缺少大括号来定义对象，因此它应该是
{entityPropertyTypes:[]}