Angularjs 角面包屑在页面刷新时不工作（ng路由）

在过去的几周里，我一直在学习Angular，我刚刚实现了面包屑服务，但当我刷新页面时，或者当我第一次导航到面包屑所在的页面时，它不起作用。如果我返回主页，然后返回“关于”页面，面包屑会按预期工作

请查看其当前状态

我相信这可能是我把面包屑放进去的方式，我不知道这些活动背后的规则

“关于”页面有一个

ng include

，用于抓取碎屑的模板：

<ul id="breadcrumb" ng-controller="crumbCtrl">
  <li><a href="#" title="Home">Home</a></li>
  <li ng-repeat="breadcrumb in breadcrumbs.getAll()">
    <ng-switch on="$last"> 
        <span ng-switch-when="true">{{breadcrumb.name}}</span> 
        <span ng-switch-default><a href="{{breadcrumb.path}}">{{breadcrumb.name}}</a></span> 
    </ng-switch>
  </li>
</ul>

---

下面是代码中发生的情况：

• breadcrumbs

  服务在

  crumbCtrl

  初始化之前不会初始化
• 当“关于”页面中包含

  breadcrumbs

  模板时，

  crumbCtrl

  开始起作用
• 在

  breadcrumbs

  服务中，您会侦听

  $routeChangeSuccess

  事件，但一旦

  breadcrumbs

  服务初始化，此“侦听器”就会激活，这在您导航到大约一次页面后发生

因此，我建议您将

$rootScope.$放在（“$routeChangeSuccess”，…）

上，放在从应用程序启动开始运行的位置（例如，在

app.run（function（$rootScope））{…}

），并添加到

breadcrumb

服务a

setBreadcrumbs（）

函数，该函数将在

$routeChangeSuccess

侦听器中调用（

breadcrumbs.setBreadcrumbs（result）

）。

---

是我建议的工作版本。

以下是代码中发生的情况：

• breadcrumbs

  服务在

  crumbCtrl

  初始化之前不会初始化
• 当“关于”页面中包含

  breadcrumbs

  模板时，

  crumbCtrl

  开始起作用
• 在

  breadcrumbs

  服务中，您会侦听

  $routeChangeSuccess

  事件，但一旦

  breadcrumbs

  服务初始化，此“侦听器”就会激活，这在您导航到大约一次页面后发生

因此，我建议您将

$rootScope.$放在（“$routeChangeSuccess”，…）

上，放在从应用程序启动开始运行的位置（例如，在

app.run（function（$rootScope））{…}

），并添加到

breadcrumb

服务a

setBreadcrumbs（）

函数，该函数将在

$routeChangeSuccess

侦听器中调用（

breadcrumbs.setBreadcrumbs（result）

）。

---

是我建议的工作版本。

以下是代码中发生的情况：

• breadcrumbs

  服务在

  crumbCtrl

  初始化之前不会初始化
• 当“关于”页面中包含

  breadcrumbs

  模板时，

  crumbCtrl

  开始起作用
• 在

  breadcrumbs

  服务中，您会侦听

  $routeChangeSuccess

  事件，但一旦

  breadcrumbs

  服务初始化，此“侦听器”就会激活，这在您导航到大约一次页面后发生

因此，我建议您将

$rootScope.$放在（“$routeChangeSuccess”，…）

上，放在从应用程序启动开始运行的位置（例如，在

app.run（function（$rootScope））{…}

），并添加到

breadcrumb

服务a

setBreadcrumbs（）

函数，该函数将在

$routeChangeSuccess

侦听器中调用（

breadcrumbs.setBreadcrumbs（result）

）。

---

是我建议的工作版本。

以下是代码中发生的情况：

• breadcrumbs

  服务在

  crumbCtrl

  初始化之前不会初始化
• 当“关于”页面中包含

  breadcrumbs

  模板时，

  crumbCtrl

  开始起作用
• 在

  breadcrumbs

  服务中，您会侦听

  $routeChangeSuccess

  事件，但一旦

  breadcrumbs

  服务初始化，此“侦听器”就会激活，这在您导航到大约一次页面后发生

因此，我建议您将

$rootScope.$放在（“$routeChangeSuccess”，…）

上，放在从应用程序启动开始运行的位置（例如，在

app.run（function（$rootScope））{…}

），并添加到

breadcrumb

服务a

setBreadcrumbs（）

函数，该函数将在

$routeChangeSuccess

侦听器中调用（

breadcrumbs.setBreadcrumbs（result）

）。

---

是我建议的工作版本。

事件

$routeChangeSuccess

不会在第一页加载时触发事件

$routeChangeSuccess

不会在第一页加载时触发事件

$routeChangeSuccess

不会在第一页加载时触发事件

$routeChangeSuccess

这很有道理，我会记住的。谢谢你的帮助，谢谢。这很有道理，我会记住的。谢谢你的帮助，谢谢。这很有道理，我会记住的。谢谢你的帮助，谢谢。这很有道理，我会记住的。谢谢你的帮助，谢谢。

var app = angular.module('dunnApp', ['ngRoute', 'services.breadcrumbs']);

app.config(['$routeProvider', function ($routeProvider) {
  $routeProvider
    // Home
    .when("/", {templateUrl: "partials/home.html", controller: "PageCtrl"})
    // Pages
    .when("/about", {templateUrl: "partials/about.html", controller: "PageCtrl"})

    // else 404
    .otherwise("/404", {templateUrl: "partials/404.html", controller: "PageCtrl"});
}]);


angular.module('dunnApp').controller('crumbCtrl', ['$scope', '$location', '$route', 'breadcrumbs',
  function ($scope, $location, $route, breadcrumbs) {
  $scope.location = $location;
  $scope.breadcrumbs = breadcrumbs;
  console.log("Crumbs online.");
  }]);

app.controller('PageCtrl', function (/* $scope, $location, $http */) {
  console.log("Page Controller online.");


});