angular-breadcrumbs

(function () {
    'use strict';

    angular
        .module('app.common.router')
        .directive('stBreadcrumbs', stBreadcrumbs);

    function stBreadcrumbs($rootParams) {
        var directive = {
            restrict: 'E',
            contoller: function($scope) {
                var rootUrl = "#/";
                $scope.crumbs = [{ url: rootUrl, text: 'Home' }];
                var runningUrl = rootUrl;
                for (var param in $rootParams) {
                    runningUrl += $routeParams[param];
                    $scope.crumbs.push({ url: runningUrl, text: $routeParams[param] });
                }

                $scope.notLast = function(crumb) {
                    return crumb !== _.last($scope.crumbs);
                }
            },
            templateUrl: 'app/common/router/stBreadcrumbs.html',
            
        };
        return directive;
    }
})();


<!--  html template file: app/common/router/stBreadcrumbs.html -->
<div class="row">
    <div class="span12">
        <ul class="breadcrumb">
            <li ng-repeat="crumb in crumbs">
                <h3>
                    <a href="{{crumb.url}}">{{crumb.text}}</a>
                    <span class="divider" ng-show="notLast(crumb)"> / </span>
                </h3>
            </li>
        </ul>
    </div>
</div>