我有一些以JSON格式的数据,并希望在我的HTML页面中查看它,我为此使用了$ Routeparams,但是数据无法从JSON文件中获取。我创建了一个这样的控制器:
angular.module('app.controllers', [
'app.directives'
])
.controller('PostController', ['$scope', '$http', function ($scope, $http){
$http.get('data/posts.json').then(function (data) {
$scope.posts = data.data;
});
}])
.controller('SinglePostController', ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams) {
$http.get('data/posts.json').then(function (data){
$scope.post = data[$routeParams.id];
});
}]);
,配置为:
angular.module('app', [
'ngRoute',
'app.controllers'
])
.config(['$routeProvider', function($routeProvider) {
$routeProvider.when('/',{
templateUrl : 'views/post.html',
controller : 'PostController'
}).when('/post/:id', {
templateUrl: 'views/singlepost.html',
controller: 'SinglePostController'
}).otherwise({
redirectTo : '/'
});
}]);
必须获取数据的HTML页面是:
<h1>{{post.title}}</h1>
<p>{{post.content}}</p>
帮助!
您可能需要在执行http.get之前声明范围变量。
.controller('SinglePostController', ['$scope', '$http', '$routeParams', function($scope, $http, $routeParams) {
$scope.post = {};
$http.get('data/posts.json').then(function (data){
$scope.post = data.data[$routeParams.id];
});