我尝试将AngularJS与插件JSON API一起使用。我没有错误,但路由不起作用,页面不打印部分/?
我把永久链接改为%postName%
.
我使用MAMP,我的链接是:http://localhost:8888/angular-wp
.
JSON内容起作用:http://localhost:8888/angular-wp/api/get_posts/
routeScope有两个值为空。
main.html
<p>main</p>
<a href=\'/demo\'>This links to /demo</a>
<ul>
<li ng-repeat=\'post in posts\'>
<a href=\'{{post.slug}}\'>{{post.title}}</a>
</li>
</ul>
demo.php
{{post.content}}
<p>demo :)</p>
index.php
<!DOCTYPE html>
<html lang=\'en\' ng-app=\'app\'>
<head>
<meta charset=\'UTF-8\' />
<title>hooo</title>
</head>
<body>
<header>
<h1>
<a href=\'/\'>Worcamp 2014</a>
</h1>
</header>
<div ng-view>TODO: have angular infect the content here via ajax</div>
<footer>© <?php echo date(\'Y\'); ?> worcamp</footer>
<script src=\'<?php echo get_template_directory_uri(); ?>/bower_components/angular/angular.js\'></script>
<script src=\'<?php echo get_template_directory_uri(); ?>/bower_components/angular-route/angular-route.js\'></script>
<script type=\'text/javascript\'>
<?php $pathTheme = get_template_directory_uri(); ?>
angular.module(\'app\', [\'ngRoute\'])
.config(function($routeProvider, $locationProvider) {
$locationProvider.html5Mode(true);
$routeProvider
.when(\'/\', {
templateUrl: \'<?php echo $pathTheme; ?>/partials/main.html\',
controller: \'Main\'
})
.when(\'/:slug\', {
templateurl:
\'<?php echo $pathTheme; ?>/partials/demo.php\',
controller: \'Slug\'
});
//.otherwise({ redirectTo: \'/\'});
})
.controller(\'Main\', function($scope, $http, $routeParams){
$http.get(\'/api/get_posts/\').success(function(res) {
$scope.posts = res.posts;
});
})
.controller(\'Slug\', function($scope, $http, $routeParams){
$http.get(\'/api/get_posts/?slug=\' + $routeParams.slug).success(function(res) {
$scope.post = res.post;
});
});
</script>
</body>
</html>