when I selected Expandable tree then Right side Static html page display in AngularJS

See more:

AngularJs

when I selected Expandable tree then Right side Static html page display in AngularJS
--------------------------------------------------------------------------------------

<script>
        var appBo = angular.module('appBo', []);
        appBo.directive('tree', function() {
          return {
            restrict: 'E',
            replace: true, 
            scope: {
              t: '=src' 
            },
            template: '<ul><branch ng-repeat="c in t.children" src="c"></branch></ul>'
          };
        })

        appBo.directive('branch', function($compile) {
          return {
            restrict: 'E',     
            replace: true, 
            scope: {
              b: '=src'.
            },
            template: '<li><a>{{ b.name }}</a></li>',
            link: function(scope, element, attrs) 
            var has_children = angular.isArray(scope.b.children);

              if (has_children) {
                element.append('<tree src="b"></tree>');

                $compile(element.contents())(scope);
              }

              //// Bind events
              element.on('click', function(event) {
                  event.stopPropagation();

                  if (has_children) {
                    element.toggleClass('collapsed');
                  }
              });
            }
          };
        })

        appBo.controller(TreelistController, function ($scope) {

          $scope.categories = {
            children: [
              {
                name: "Item A",
                children: [
                  {
                    name: "Item A-1",
                    children: [
                      {
                        name: "Item A-1-1"
                      },
                      {
                        name: "Item A-1-2"
                      }
                    ]
                  },
                  {
                    name: "Item A-2"
                  },
                      {
                        name: "Item A-3"
                      }
                ]
              },
            ]
          };
        });
    </script>