2015-07-29 1 views
0

J'ai des fils d'Ariane mis en œuvre dans trois états ci-dessous, l'utilisateur Dashboard peut sélectionner un processus qui va naviguer vers edit.process et l'utilisateur peut également revenir de modifier le processus à Dashboard en utilisant le lien hypertexte. Donc, voici le problème lorsque l'utilisateur dans app.search état, il peut sélectionner le processus qui va naviguer à edit.process état Maintenant, ici l'utilisateur a seulement l'option pour revenir à Dashboard.Mais je veux mettre en œuvre la logique lorsque l'utilisateur est en cours de navigation de app.search état que je veux montrer app.search lien hypertexte sur edit.process état d'ariane si l'utilisateur peut retourner d'où il vient ...Comment breadcrumb peut se souvenir du chemin?

app.js

.state('app.home', { 
      url: '/', 
      templateUrl: 'views/riskHomePage/riskAssesmentHomePage.html', 
      controller: 'HomeCtrl', 
      data: { 
       authenticate: true 
      }, 
      breadcrumb: { 
       title: 'Dashboard', 
       path: ['app.home'] 
      } 
     }) 

    .state('app.editProcess', { 
      url: '/process/:processId/:refresh?:from', 
      templateUrl: 'views/process/createEditProcessContent.html', 
      controller: 'ProcessCtrl', 
      data: { 
       authenticate: true 
      }, 
      resolve: { 
       existingProcess: function($http, $stateParams, $rootScope){ 
        $rootScope.showLoader = true; 
        return $http.get('app/prcs/rest/process/'+ $stateParams.processId); 
       } 
      }, 
      breadcrumb: { 
       title: 'Edit Process', 
       path: ['app.home', 'app.editProcess'] 
      } 
     }) 

.state('app.search', { 
      url: '/viewSearchInv', 
      templateUrl: 'views/viewAll/viewSearchInv.html', 
      controller: 'ViewSearchInvCtrl', 
      data: { 
       authenticate: true 
      }, 
      breadcrumb: { 
       title: 'View Search PRC inventory', 
       path: ['app.home','app.search'] 
      } 
     }) 
+0

cela pourrait être utile en utilisant ncy-breadcrumb https://github.com/ncuillery/angular-breadcrumb –

Répondre

2

Vous souhaitez créer un service de fil d'Ariane, puis l'injecter dans chaque contrôleur.

ici est un tutoriel bien http://milestone.topics.it/2014/03/angularjs-ui-router-and-breadcrumbs.html

une autre façon que je l'ai fait dans le passé est en gardant un tableau de panure sur rootScope $. instancier comme ça.

angular.module('myApp', []) 
.run(function($rootScope) { 
    $rootScope.breadcrumbs = []; 
}) 

puis dans chaque contrôleur i pousser le fil d'Ariane qui lien vers cet état au tableau panure. normalement mon objet fil d'Ariane a le texte d'affichage et la référence d'état de lien/ui-routeur.

.controller('myCtrl', function($scope, $rootScope) { 
    $rootScope.breadcrumbs.push({ title: "First Breadcrumb", state: "stateName" }) 
}) 

puis pour afficher les miettes de pain utilisent ng répétition et gérer la sélection de l'un des miettes de pain avec une fonction ng-clic qui trims panure au fil d'ariane sélectionné et charge l'état correspondant