我正在关注这个 AngularJS Tutorial .
当使用对象文字表示法实例化时,我能够在浏览器 (Chrome 37.0.2062.94) 中成功显示数据模型数组列表,其中 $scope.sentences 是“对象”类型。
Controller :(提取)
'use strict';
angular.module('YeomanIonic.controllers', [])
.controller('MapCtrl', ['$scope', '$ionicLoading', '$http', function($scope, $ionicLoading, $http) {
$scope.sentences = [
{"name": "Hello",
"snippet": "1"
},
{"name": "Goodbye",
"snippet": "2"
}
];
}]);
查看(摘录):
<body ng-app="YeomanIonic" ng-controller="MapCtrl">
<ul>
<li ng-repeat="sentence in sentences">
<span>{{sentence.name}}</span>
<p>{{sentence.snippet}}</p>
</li>
</ul>
但是当我将这个哈希数组存储在 JSON 文件(即 app/data/sentences.json)中时,我遇到了问题,如下所示:
句子.JSON:
[
{"name": "Hello",
"snippet": "1"
},
{"name": "Goodbye",
"snippet": "2"
}
];
我尝试使用 AngularJS $http 服务执行 HTTP GET 请求以获取此 JSON 数据。本教程提到 AngularJS 会自动检测和解析 JSON 响应,并且 $http 服务会返回一个带有成功方法的 promise 对象。所以我假设下面的代码可以正常工作,这样 $scope.sentences 将是“Object”类型,但它告诉我它是“String”类型。
$http({
method: 'GET',
url: 'data/sentences.json'
}).
success(function(data, status, headers, config) {
console.log("HTTP Request - Success");
$scope.sentences = data;
console.log(typeof($scope.sentences));
}).
error(function(data, status, headers, config) {
console.log("HTTP Request - Error");
});
所以我试图用下面的代码来分配它,它给出了以下错误:
$scope.sentences = angular.fromJson(data);
SyntaxError: Unexpected token ;
at Object.parse (native)
at Object.fromJson (http://127.0.0.1:9000/bower_components/angular/angular.js:1139:14)
at http://127.0.0.1:9000/scripts/controllers.js:34:59
at http://127.0.0.1:9000/bower_components/angular/angular.js:8105:11
at wrappedCallback (http://127.0.0.1:9000/bower_components/angular/angular.js:11561:81)
at wrappedCallback (http://127.0.0.1:9000/bower_components/angular/angular.js:11561:81)
at http://127.0.0.1:9000/bower_components/angular/angular.js:11647:26
at Scope.$eval (http://127.0.0.1:9000/bower_components/angular/angular.js:12673:28)
at Scope.$digest (http://127.0.0.1:9000/bower_components/angular/angular.js:12485:31)
at Scope.$apply (http://127.0.0.1:9000/bower_components/angular/angular.js:12777:24) angular.js:10061
我尝试了以下包含引号的替代方案,它给出了以下错误(与“数据”一词中的字母“d”混淆):
$scope.sentences = angular.fromJson('data');
SyntaxError: Unexpected token d
at Object.parse (native)
at Object.fromJson (http://127.0.0.1:9000/bower_components/angular/angular.js:1139:14)
at http://127.0.0.1:9000/scripts/controllers.js:34:59
at http://127.0.0.1:9000/bower_components/angular/angular.js:8105:11
at wrappedCallback (http://127.0.0.1:9000/bower_components/angular/angular.js:11561:81)
at wrappedCallback (http://127.0.0.1:9000/bower_components/angular/angular.js:11561:81)
at http://127.0.0.1:9000/bower_components/angular/angular.js:11647:26
at Scope.$eval (http://127.0.0.1:9000/bower_components/angular/angular.js:12673:28)
at Scope.$digest (http://127.0.0.1:9000/bower_components/angular/angular.js:12485:31)
at Scope.$apply (http://127.0.0.1:9000/bower_components/angular/angular.js:12777:24) angular.js:10061
我尝试了第三种选择,它给出了与前面相同的错误:
$scope.sentences = window.JSON.parse('data');
我尝试了第四种选择,它也给出了与前面相同的错误:
$scope.sentences = JSON.parse('data');
在希望渺茫的情况下,我看到了这篇提到使用 eval('data') 的 [救星帖子] ( https://stackoverflow.com/a/6487190/3208553 ),但也提到它存在安全风险,但我试了一下:
$scope.sentences = eval(data);
这有效!!它成功地从 JSON 文件中抓取数据并将其显示为浏览器中的列表。请注意,当我检查它分配的内容时 console.log(eval(data));它给了我 [object Object],[object Object],[object Object],[object Object]
但我不能庆祝,因为我不明白为什么我尝试过的其他替代方案不起作用...
所以我对社区的问题是:
- 为什么 AngularJS $http 服务不自动检测和解析 JSON 响应并将其作为对象(而不是字符串)返回?
- 为什么 AngularJS 没有 fromJSON反序列化 JSON 字符串没有错误? (它似乎只是根据其 Source Code 执行 JSON.parse('') )
- 在这个简单的示例中,我的 JSON 编码是否合格?我的输入是否被错误地验证了?这就是为什么只有不安全的“评估”方法对我有效(具有相关的安全风险)吗?
仅供引用,Here是与 GitHub 上的这篇文章相关的对我的 Ionic 应用程序的最新提交
最佳答案
在我的 JSON 文件中发现缺少逗号后,我修复了这个错误。
关于javascript - 使用 Generate Ionic 使用 AngularJS 将 JSON 字符串反序列化为对象,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25829315/