I want to fetch data from JSON file which is on my local machine. But I am not able to get the data. It is showing some cross domain error for $http.
我想从本地机器上的JSON文件中获取数据。但是我不能得到数据。它显示了$http的一些跨域错误。
Here is my code.
这是我的代码。
angular.module('myApp',[]).controller('myCtrl', function ($scope, webtest) {webtest.fetch().then(function (data) {$scope.accounttype = data;})}); .factory('webtest', function($q, $timeout, $http) {var Webtest = {
fetch: function(callback) {
return $timeout(function() {
return $http.get('webtest.json').then(function(response) {
return response.data;
});
}, 30);
}
};
return Webtest;});
Anyone please help me how to display data from local JSON file? Thanks in Advance.
有人能帮我展示一下本地JSON文件的数据吗?提前谢谢。
3 个解决方案
#1
30
AngularJs < 1.6
AngularJs < 1.6
Try by giving success and failure call backs:
试着给成功和失败打回电话:
$http.get('someFile.json')
.success(function(data) {
angular.extend(_this, data);
defer.resolve();
})
.error(function() {
defer.reject('could not find someFile.json');
});
AngularJs > 1.6
AngularJs > 1.6
$http.get('someFile.json').
then(function onSuccess(response) {
angular.extend(_this, data);
defer.resolve();
}).
catch(function onError(response) {
console.log(response);
});
Refer:Read local file in AngularJS
参考:在AngularJS中读取本地文件
#2
3
Don't you have an error message like "$http: is not defined" ?
您没有像“$http:没有定义”这样的错误消息吗?
I tried with a controller, this is working :
我尝试了一个控制器,这是有效的:
var ngApp = angular.module("ngApp", []);
ngApp.controller('myController', ['$http', function($http){
var thisCtrl = this;
this.getData = function () {
this.route = 'webtest.json';
$http.get(thisCtrl.route)
.success(function(data){
console.log(data);
})
.error(function(data){
console.log("Error getting data from " + thisCtrl.route);
});
}
}]);
If you haven't, use web developer tools (Ctrl+Shift+I in firefox).
如果没有的话,可以使用web developer tools (Ctrl+Shift+I in firefox)。
#3
1
If you haven't already done so. Try setting up a crossdomain policy for your application.
如果你还没有这样做的话。尝试为应用程序设置一个跨域策略。
#1
30
AngularJs < 1.6
AngularJs < 1.6
Try by giving success and failure call backs:
试着给成功和失败打回电话:
$http.get('someFile.json')
.success(function(data) {
angular.extend(_this, data);
defer.resolve();
})
.error(function() {
defer.reject('could not find someFile.json');
});
AngularJs > 1.6
AngularJs > 1.6
$http.get('someFile.json').
then(function onSuccess(response) {
angular.extend(_this, data);
defer.resolve();
}).
catch(function onError(response) {
console.log(response);
});
Refer:Read local file in AngularJS
参考:在AngularJS中读取本地文件
#2
3
Don't you have an error message like "$http: is not defined" ?
您没有像“$http:没有定义”这样的错误消息吗?
I tried with a controller, this is working :
我尝试了一个控制器,这是有效的:
var ngApp = angular.module("ngApp", []);
ngApp.controller('myController', ['$http', function($http){
var thisCtrl = this;
this.getData = function () {
this.route = 'webtest.json';
$http.get(thisCtrl.route)
.success(function(data){
console.log(data);
})
.error(function(data){
console.log("Error getting data from " + thisCtrl.route);
});
}
}]);
If you haven't, use web developer tools (Ctrl+Shift+I in firefox).
如果没有的话,可以使用web developer tools (Ctrl+Shift+I in firefox)。
#3
1
If you haven't already done so. Try setting up a crossdomain policy for your application.
如果你还没有这样做的话。尝试为应用程序设置一个跨域策略。