0

我在我的众多 Angular 项目之一中使用 Wordpress 作为主干,我是 Angular 的新手,花了很多时间阅读和学习。

此时我的问题是我设法使路由工作,但由于某种原因,默认方式(没有 html5 模式)不起作用。

我有一个列表,当点击一个链接时,我应该转到一个参数化的 url,我得到了这个错误

http://screencast.com/t/024t0Pl6

我有一个应用程序、服务和控制器文件,我将在此处发布内容:

应用程序.js

angular.module('AngularWP', ['controllers', 'services', 'directives'])
.config(['$routeProvider', '$locationProvider',
    function($routeProvider, $locationProvider) {
        $locationProvider.html5Mode(true);
        $routeProvider
            .when('/', {
                controller: 'ListController',
                templateUrl: 'templates/list.html'
            })
            .when('/view/:id', {
                controller: 'DetailController',
                templateUrl: 'templates/detail.html'
            })
            .otherwise({
                redirectTo: '/'
            });
    }
]);

服务.js

    angular.module('services', [])
  .factory('getAllPosts', ['$http',
    function($http) {
      return {
        get: function(callback) {
          $http.get('/wordpress/api/get_recent_posts/').success(function(data) {
            // prepare data here
            callback(data);
          });
        }
      };
    }
  ])

控制器.js

angular.module('controllers', [])
.controller('ListController', ['$scope', 'getAllPosts',
    function($scope, getAllPosts) {
        getAllPosts.get(function(data) {
            $scope.posts = data.posts;
        });
    }
])
.controller('DetailController', ['$scope', 'getAllPosts', '$routeParams',
    function($scope, getAllPosts, $routeParams) {
        getAllPosts.get(function(data) {
            console.log(data);
            for (var i = data.count - 1; i >= 0; i--) {
                //data.count[i]
                //console.log('post id is ' + data.posts[i].id);
                //console.log('routeparam is ' + $routeParams);
                if (data.posts[i].id == [$routeParams.id]) {
                    //console.log(data.posts[i]);
                    $scope.post = data.posts[i];
                }
            };
        });

        //$scope.orderProp = 'author';
    }
]);

可能是什么问题呢?

4

2 回答 2

1

显然这个问题的解决方案是这样的:

<script>
      document.write('<base href="' + document.location + '" />');
    </script>

在模板中。Angular 路由器是相对于当前 URL 的。

于 2013-08-10T17:17:46.967 回答
0

我遇到过同样的问题。通过切换到 1.0.7 为我解决了这个问题。

于 2013-08-15T14:39:50.197 回答