Javascript 将JSON文件导入Grunt服务器上运行的Angular应用程序
我遵循基本的Angular教程,需要在其中包含一个JSON文件。 我用Yeoman启动了我的应用程序,它正在grunt上运行Javascript 将JSON文件导入Grunt服务器上运行的Angular应用程序,javascript,json,node.js,angularjs,gruntjs,Javascript,Json,Node.js,Angularjs,Gruntjs,我遵循基本的Angular教程,需要在其中包含一个JSON文件。 我用Yeoman启动了我的应用程序,它正在grunt上运行 var phonecatApp = angular.module('phonecatApp', []); phonecatApp.controller('PhoneListCtrl', function PhoneListCtrl($scope) { $http.get('phones/phones.json').success(function(data) {
var phonecatApp = angular.module('phonecatApp', []);
phonecatApp.controller('PhoneListCtrl', function PhoneListCtrl($scope) {
$http.get('phones/phones.json').success(function(data) {
$scope.phones = data;
});
});
但是,当我转到localhost:9000时,会出现一系列控制台错误:
ReferenceError: $http is not defined
at new PhoneListCtrl (http://localhost:9000/scripts/controllers/main.js:17:3)
at invoke (http://localhost:9000/bower_components/angular/angular.js:3000:28)
at Object.instantiate (http://localhost:9000/bower_components/angular/angular.js:3012:23)
at http://localhost:9000/bower_components/angular/angular.js:4981:24
at http://localhost:9000/bower_components/angular/angular.js:4560:17
at forEach (http://localhost:9000/bower_components/angular/angular.js:137:20)
at nodeLinkFn (http://localhost:9000/bower_components/angular/angular.js:4545:11)
at compositeLinkFn (http://localhost:9000/bower_components/angular/angular.js:4191:15)
at compositeLinkFn (http://localhost:9000/bower_components/angular/angular.js:4194:13)
at publicLinkFn (http://localhost:9000/bower_components/angular/angular.js:4096:30)
任何帮助都将不胜感激 在您的
函数PhoneListCtrl($scope,$http){}
中将$http
添加为依赖项,在函数PhoneListCtrl($scope,$http){}
中将json文件包含在工厂服务中可能会更好。这样,您就可以缓存它,并继续与不同的控制器一起使用它
我有一个类似的问题,并解决了它像这样
var App = angular.module('App', []);
// Setting up a service to house our json file so that it can be called by the controllers
App.factory('service', function($http) {
var promise;
var jsondata = {
get: function() {
if ( !promise ) {
var promise = $http.get('src/data_json.js').success(function(response) {
return response.data;
});
return promise;
}
}
};
return jsondata;
});
App.controller('introCtrl', function (service , $scope) {
service.get().then(function(d) {
$scope.header = d.data.PACKAGE.ITEM[0]
})
});
App.controller('secondCtrl', function (service , $scope) {
service.get().then(function(d) {
$scope.title = d.data.PACKAGE.ITEM[1]
})
});
我想我现在明白了。非常感谢。