landers.angular/src/control/directive-breadcrumbs.js

landers.angular

;angular.module('Landers.angular')
    .directive('breadcrumb', function() {
        var separator = '/';
       return {
            restrict: 'EA',
            template:
                '<ol class="breadcrumb">'+
                '   <li ng-repeat=\'bc in datasource\' ng-class="{\'active\':datasource.length-1 == $index}">'+
                '       <a ng-hide="datasource.length-1 == $index" ng-click="removeUntil($index)" ng-href="{{bc.href}}" class="hand">{{bc.label}}</a>'+
                '       <span ng-show="datasource.length-1 == $index">{{bc.label}}</span>'+
                '   </li>'+
                '</ol>',
            replace: true,
            scope: {
                    datasource: '=',
                    onActive: '&'
            },
            compile: function(tElement, tAttrs) {
                return function($scope, $elem, $attr) {
                    $scope.removeUntil = function(index) {
                        $scope.datasource = $scope.datasource.splice(0, index+1);
                        var onActive = $scope.onActive();
                        onActive && onActive(
                            $scope.datasource[index],
                            index
                        );
                        return false;
                    };

                };//end of return
            }//end of compile
       };
    });
    // module.directive('breadcrumb', ['$log', '$compile', function($log, $compile) {
    //     var separator = '/';
    //     var html = '';
    //     html += '   <ol class="breadcrumb">';
    //     html += '   <li ng-repeat=\'bc in datasource\' ng-class="{\'active\':datasource.length-1 == $index}">';
    //     html += '       <a ng-hide="datasource.length-1 == $index" ng-click="unregisterBreadCrumb($index)" ng-href="{{bc.href}}">'
    //     html += '           {{bc.label}}';
    //     html += '       </a>';
    //     html += '       <span ng-show="datasource.length-1 == $index">{{bc.label}}</span>';
    //     html += '   </li>';
    //     html += '</ol>'

    //    return {
    //         restrict: 'A',
    //         compile: function(tElement, tAttrs) {
    //             return function($scope, $elem, $attr) {


    //                 $ele = $($compile(html)(myScope)).replaceAll($ele);

    //                 buildPath = function() {
    //                         var p = "";
    //                         angular.forEach($scope.datasource, function(v) {
    //                            p = p + separator + v.label;
    //                         });
    //                         return p;
    //                     };

    //                 $scope.unregisterBreadCrumb = function(index) {
    //                     var newDs = $scope.datasource.slice();
    //                     $scope.datasource= [];
    //                     for(var i=0;i<index+1; i++){
    //                           $scope.datasource.push(newDs[i]);
    //                     }
    //                      var path = buildPath();
    //                      $scope.onNodeSelected()(path,index);
    //                 };

    //             };
    //         }
    //    };
    // }]);