Javascript 基于数据的分层列表按钮

我想要一个指令，它将根据类别层次名称数组呈现按钮列表。一个按钮将选择类别，如果它没有更多的子类别，或者如果它有子类别，则将向下钻取到下一个级别

i/p:

[{name:electronics'}，{name:'爱好'}，{name:'电子|计算机'}，{name:'电子|计算机|软件'}，{name:'电子|耳机'}]

上面的数组将首先渲染2个按钮，单击电子设备将渲染新按钮：计算机和耳机等

我试过：

  controller: ['$scope', function($scope) {
    $scope.category= [];
    $scope.init = function() {
        for(var index=0; index<$scope.option.data.length; index++) {
            if($scope.option.data[index].name.indexOf("|") === -1){
                $scope.category.push($scope.option.data[index]);
            }
        }
    }
    $scope.init();

    $scope.drillDown=function(value){
        // console.log(value);
        var count = 0;
        var arrVal=[];
        arrVal=value
         $scope.category= [];

         for(var index=0; index<$scope.option.data.length; index++) {

            if($scope.option.data[index].name.indexOf(value + "|") !== -1){

                for(var i=0; i< $scope.option.data[index].name.length; i++){    
                if($scope.option.data[index].name[i] == '|'){
                    count+=1;
                    }
                }
                if(count === 1){

                         $scope.category.push($scope.option.data[index]);
                    }     

                 count = 0;
        }


        }
    }
}]

控制器：['$scope'，函数（$scope）{
$scope.category=[]；
$scope.init=函数（）{
对于（var index=0；index请检查以下代码段：

        $scope.drillDown = function(event){

                $scope.delimiter = '|';  
                $scope.buttons = [];
                $scope.delimiterCount = (event.n.split($scope.delimiter).length - 1);
                $scope.flagAll = false;
                angular.forEach($scope.option.data,function(value,index){
                    if($scope.option.data[index].name.indexOf(event.n+$scope.delimiter) !== -1){
                        $scope.splitData = $scope.option.data[index].name.split($scope.delimiter);
                        if($scope.flagAll == false){
                            $scope.buttons.push("All "+$scope.splitData[$scope.delimiterCount]);
                            $scope.flagAll = true;
                        }
                        if(($scope.splitData.length-1) > ($scope.delimiterCount+1)){
                            //$scope.buttons.push("All "+$scope.splitData[$scope.delimiterCount]);
                        }
                        else{
                            $scope.buttons.push($scope.option.data[index].name);
                        }
                    }
                });
            }