基于angular-utils-ui-breadcrumbs使用心得(分享)

var app = angular.module('myapp', ['ui.router.state.events','angularUtils.directives.uiBreadcrumbs']);

//index.js
var app = angular.module('myapp', ['ui.router.state.events','angularUtils.directives.uiBreadcrumbs']);

app.config(['$stateProvider', '$urlRouterProvider', ($stateProvider, $urlRouterProvider) =>{
 $urlRouterProvider.otherwise('/home/production');
 $stateProvider
  .state('home', {
   abstract: true,
   url: '/home',
   data: {
    proxy: 'home.info'
   },
   views: {
    'home@': {
     template: '
'
    }
   }
  })
  .state('home.info', {
   url: '/info',
   data: {
    displayName: 'home'
   },
   views: {
    'content@home': {
     template: 'production'
    }
   }
  })
  .state('home.production', {
   url: '/production',
   data: {
    displayName: 'production'
   },
   views: {
    'content@home': {
     template: 'fruits'
    }
   }
  })
  .state('home.production.fruits', {
   url: '/fruits',
   data: {
    displayName: 'fruits'
   },
   views: {
    'content@home': {
     template: `

      
apple
      
banane
      
pear
     
`
    }
   }
  })
  .state('home.production.fruits.detail', {
   url: '/:type',
   data: {
    displayName: 'detail'
   },
   views: {
    'content@home': {
     template: '
{{$resolve.fruit}}
'
    }
   },
   resolve: {
    fruit: ['$stateParams', $stateParams =>{
     return $stateParams.type
    }]
   }
  })
}]);

　 var moduleName = 'angularUtils.directives.uiBreadcrumbs';
 var templateUrl = 'directives/uiBreadcrumbs/uiBreadcrumbs.tpl.html';

 /**
  * Module
  */
 var module;
 try {
  module = angular.module(moduleName);
 } catch(err) {
  // named module does not exist, so create one
  module = angular.module(moduleName, ['ui.router']);
 }