コントローラー 'niInclude'に必要なコントローラー 'uiTreeNodes'が見つかりません

Question

angularui-treeを使用しようとしていて、Vistulaforce（salesforce）ページ内で動作させようと数日間苦労しましたが、その他。今、私は基本的な入れ子ツリーの例を実行しようとしていますが、それはエラーを投げていると私は彼らの指示に従ってすべてをやっているとき、なぜ私は見ることができません。誰でもplできますか？何がうまくいかないか理解するのを手伝ってください。

Visualforceページ

<apex:page showHeader="false"> 
     <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.4/angular.min.js"/> 
     <link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/angular-ui-tree/2.22.1/angular-ui-tree.min.css"/> 
     <script src = "https://cdnjs.cloudflare.com/ajax/libs/angular-ui-tree/2.22.1/angular-ui-tree.min.js"/> 
     <link rel = "stylesheet" href = "https://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css"/> 

     <script    src = "https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"/> 
     <script    src = "//ajax.googleapis.com/ajax/libs/angularjs/1.5.0-beta.2/angular-sanitize.js"/> 

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> 



<script type="text/javascript"> 

    var app = angular.module('MyApp', ['ui.tree']); 
    app.controller('treeCtrl', function($scope) { 



     $scope.tree1 = []; 


     $scope.tree1 = [{ 
      'id': 1, 
      'title': 'tree1 - item1', 
      'nodes': [] 
     }, { 
      'id': 2, 
      'title': 'tree1 - item2', 
      'nodes': [] 
     }, { 
      'id': 3, 
      'title': 'tree1 - item3', 
      'nodes': [] 
     }, { 
      'id': 4, 
      'title': 'tree1 - item4', 
      'nodes': [] 
     }]; 
     $scope.tree2 = [{ 
      'id': 1, 
      'title': 'tree2 - item1', 
      'nodes': [] 
     }, { 
      'id': 2, 
      'title': 'tree2 - item2', 
      'nodes': [] 
     }, { 
      'id': 3, 
      'title': 'tree2 - item3', 
      'nodes': [] 
     }, { 
      'id': 4, 
      'title': 'tree2 - item4', 
      'nodes': [] 
     }]; 

     $scope.remove = function (scope) { 
      scope.remove(); 
     }; 

     $scope.toggle = function (scope) { 
      scope.toggle(); 
     }; 

     $scope.newSubItem = function (scope) { 
      var nodeData = scope.$modelValue; 
      nodeData.nodes.push({ 
       id: nodeData.id * 10 + nodeData.nodes.length, 
       title: nodeData.title + '.' + (nodeData.nodes.length + 1), 
       nodes: [] 
      }); 
     }; 



}); 

 <div ng-app="MyApp"> 
      <div ng-controller="treeCtrl"> 

       <div ui-tree="ui-tree"> 
        <ol ui-tree-nodes="" ng-model="tree1" id="tree-root"> 
        <li ng-repeat="node in tree1" ui-tree-node="ui-tree-node" ng-include="'nodes_renderer.html'"></li> 
        </ol> 
       </div> 

       <script type="text/ng-template" id="nodes_renderer.html"> 
        <div ui-tree-handle="ui-tree-handle"> 
        {{node.title}} 
        </div> 
        <ol ui-tree-nodes="" ng-model="node.nodes"> 
        <li ng-repeat="node in node.nodes" ui-tree-node="ui-tree-node" ng-include="'nodes_renderer.html'"> 
        </li> 
        </ol> 
       </script> 


     </div> 
    </div> 

エラーメッセージ：

Answer 1

ここではangular-ui-tree

のためのサンプルコードです

https://jsfiddle.net/hardiksondagar/gt00pr9x/

注：jQueryのも、私にとっては純粋なJavascriptを