0

我正在尝试使用angularui-tree，经过几天的努力使其在 Vistulaforce(salesforce) 页面内运行，它仍然显示一些错误或其他。现在我正在尝试运行基本的嵌套树 ui 示例，但它抛出了一个错误，当我按照他们的指示做所有事情时，我不明白为什么。任何人都可以请。帮助我了解出了什么问题。

视觉力量页面

<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>

错误信息： 在此处输入图像描述

4

1 回答 1

0

这是示例代码angular-ui-tree

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

注意：不需要 jQuery，因为 angular-ui-tree 基于纯 Javascript

于 2016-11-30T12:56:47.807 回答