Angularjs UI路由器未评估Wordpress主题中的路由

Angularjs UI路由器未评估Wordpress主题中的路由,angularjs,wordpress,angular-ui-router,Angularjs,Wordpress,Angular Ui Router,我正在使用AngularJS构建一个wordpress主题,并且已经切换到使用ui路由器而不是ngRoute。通常情况下,除非我刷新页面或在浏览器中键入URL,否则一切正常。页面已加载,但未加载任何状态。唯一的例外是在/blog上,这是一个与wordpress URL不匹配的页面。Wordpress抛出了一个404,但是Angular加载了正确的路径-我不明白Wordpress所做的是如何影响Angular的,因为在所有情况下,加载的都是同一个文件(index.php),Angular本身启动,

我正在使用AngularJS构建一个wordpress主题,并且已经切换到使用ui路由器而不是ngRoute。通常情况下,除非我刷新页面或在浏览器中键入URL,否则一切正常。页面已加载,但未加载任何状态。唯一的例外是在/blog上,这是一个与wordpress URL不匹配的页面。Wordpress抛出了一个404,但是Angular加载了正确的路径-我不明白Wordpress所做的是如何影响Angular的,因为在所有情况下,加载的都是同一个文件(index.php),Angular本身启动,console.log()证明了这一点

我使用ngRoute进行了非常相似的配置,无论wordpress是否抛出404,一切都正常工作

单击菜单链接时,状态将正确加载,URL将按指定进行更改

如果我取消注释,“否则”语句将在除/blog之外的所有URL上触发,并重定向到主页

在错误情况下(除/blog之外的所有情况),诊断状态$on()事件不会触发

主代码的顶部

app = angular.module('app', ['ngSanitize','ngAnimate', 'ui.router']);

app.config(function($locationProvider) {
    $locationProvider.html5Mode(true);
});

app.run( function($rootScope) {

  console.log('angular');

  $rootScope.$on('$stateChangeStart', 
    function(event, toState, toParams, fromState, fromParams){ 
      console.log('start');
    });

  $rootScope.$on('$stateNotFound', 
    function(event, toState, toParams, fromState, fromParams){ 
      console.log('not found');
    });

  $rootScope.$on('$stateChangeError', 
    function(event, toState, toParams, fromState, fromParams, error){ console.log(error); });

});    

app.config(function($stateProvider, $urlRouterProvider) {

  // $urlRouterProvider.otherwise("/");

  $stateProvider
    .state('root', {
      url: "/",
      templateUrl: myLocalized.partials + 'front.html',
      controller: 'Main'
    })
    .state('portfolio', {
      url: "/portfolio",
      templateUrl: myLocalized.partials + 'portfolio.html',
      controller: 'Portfolio'
    })
    .state('portfolio.item', {
      url: "/portfolio/:slug",
      templateUrl: myLocalized.partials + 'portfolio-item.html',
      controller: 'Portfolio'
    })
    .state('blog', {
      url: "/blog",
      templateUrl: myLocalized.partials + 'blog.html',
      controller: 'Blog'
    })
    .state('page', {
      url: '/:slug',
      templateUrl: myLocalized.partials + 'content.html',
      controller: 'Page',
      resolve: {
        pageData: function(WPService, $stateParams) {
          console.log($stateParams);
          return WPService.getPageBySlug($stateParams.slug);
        }
      }
    });

});

我将
包含在页面标题中,并在index.php文件中设置了ui视图属性。

在深入研究ui路由器代码后,我发现这与尾部斜杠有关。htaccess(我想)会在URL与Wordpress中的页面或其他资源匹配时添加一个尾随斜杠。这导致ui路由器无法识别URL,因为我的任何路由/状态的末尾都没有斜杠。在404s的情况下,wordpress没有添加斜杠,因此ui路由器匹配正确并处理路由

我通过修改wordpress permalink设置来解决这个问题,使其不具有尾随斜杠

编辑:您还可以使用$URLMacherFactoryProvider.strictMode(false);在配置块中,以允许尾部斜杠