锚点href与Angular路由的链接方式

Question

我在多个视图之间使用angular路由，并尝试在每次路由更改时填充一个公共的面包屑列表。这很好用，但是面包屑中的超链接不起作用。

基本上，我有一个具有以下视图的站点：

views/main.html

views/page_a.html

views/page_b.html

和结构：

主页 > 页面a > 页面b

$rootScope.$on('$routeChangeSuccess', function(scope, next, current) {  

    var thisView = next.loadedTemplateUrl;
    if (!thisView) return;
    var breadcrumb = jQuery('#breadCrumb'); //<ol> container
    breadcrumb.empty();

    if (thisView.indexOf('page_a') >= 0) {
      breadcrumb.append('<li><a href="#/main">main</a></li>');    
      breadcrumb.append('<li class="active">page a</li>'); 
    }
    else if (thisView.indexOf('page_b') > 0) {
      breadcrumb.append('<li><a href="#/main">main</a></li>');    
      breadcrumb.append('<li><a href="#/page_a">page a</a></li>');
      breadcrumb.append('<li class="active">page b</li>'); 
    }
  });

很不幸，这些超链接并没有链接到正确的位置。我想我已经尝试过所有的组合，例如#/page_a、#/page_a.html、/views/page_a.html等等，但都没有成功。感觉这不应该太难，但时间已经很晚了，所以希望得到一些帮助。谢谢！

编辑

我的路由设置如下：

app.config(function ($routeProvider) {
  $routeProvider
  .when('/', {
    templateUrl: 'views/main.html',
    controller: 'MainCtrl'
  })
  .when('/page_a', {
    templateUrl: 'views/page_a.html'
  })
  .when('/page_b', {
    templateUrl: 'views/page_b.html'
  })
  .otherwise({
    redirectTo: '/'
  });
});

- jola

---

你的路由设置如何？视图不是路由。 - Jorg

#/main是一个路由，当配置您的路由时不存在。要么将您的链接更改为“＃/”，要么将您的路由更改为“＃/main”。 - Lucas Rodriguez

Answer 1

好的，这是一个非常愚蠢的错误，我本来不需要发帖问问题的.. 实际上是 href="#/page_a"，它可以正常工作，所以这就像预期的那样简单。

- jola