html – Angular treeview节点上的按钮不起作用

概述我从网站下载了角度树视图 http://ngmodules.org/modules/angular.treeview并在我的项目中实现(VS C#)做了bundels等…无论如何……它在我的屏幕上提示正确.所以我可以点击“添加新点”按钮,它会添加新的NODE. 不工作： >展开和折叠全部给出“RangeError：超出最大调用堆栈大小” >加号按钮(蓝色是添加节点),x按钮(红色 – 删除)按钮不 我从网站下载了角度树视图
http://ngmodules.org/modules/angular.treeview并在我的项目中实现(VS C#)做了bundels等…无论如何……它在我的屏幕上提示正确.所以我可以点击“添加新点”按钮,它会添加新的NODE.

不工作：

>展开和折叠全部给出“RangeError：超出最大调用堆栈大小”
>加号按钮(蓝色是添加节点),x按钮(红色 – 删除)按钮不起作用.当我尝试单击添加节点或删除节点按钮时,它完全将它自己直接对准NODE,因为我喜欢移动节点.

它看起来像节点获得优先权和按钮节点.我在Chrome中调试,当我点击按钮时,它没有进入控制器.

我究竟做错了什么？或者我该如何追踪它？它没有击中控制器:(

代码是从tree.Js复制的

<div >    <h1 >Tree - demo</h1>    <a href="index.HTML"><i ></i> Back to overvIEw page</a>    <pre >{{ edit }}</pre>    <div >        <div >            Options:            <a href=""  ng-click="">doc1 </a>            <a href=""  ng-click="">doc2 </a>            <a href=""  ng-click="">copy Default Agenda</a>            <hr />            <h4 >                Agenda                <a href=""  ng-click="collapseAll()">Collapse all</a>                <a href=""  ng-click="expandAll()">Expand all</a>                <a href=""  ng-click="newItem()">Add New Point</a>            </h4>            <!-- nested node template -->            <script type="text/ng-template" ID="nodes_renderer.HTML">                <div ui-tree-handle >                    <!--green left Box-->                    <a  ng-if="node.nodes && node.nodes.length > 0" data-nodrag ng-click="toggle(this)">                        <span  ng-></span>                    </a>                    <!--input Box for node-->                    <span ng-hIDe="edit">{{node.Title}}</span>                    <!--edit mode-->                    <a  data-nodrag ng-hIDe="edit" ng-click="edit = true">                        <span ></span>                    </a>                    <!--edit save-->                    <input type="text"  ng-show="edit" ng-model="node.Title">                    <a  data-nodrag ng-show="edit" ng-click="edit = false">                        <span ></span>                    </a>                    <!--remove-->                    <a  data-nodrag ng-click="remove(this)">                        <span ></span>                    </a>                    <!--add-->                    <a  data-nodrag ng-click="newSubItem(this)" >                        <span ></span>                    </a>                    <!--upload-->                    <a  data-nodrag ng-click="uploadfile(this)" >                        <span ></span>                    </a>                </div>                <!--node childs-->                <ol ui-tree-nodes="" ng-model="node.nodes" ng->                    <li ng-repeat="node in node.nodes" ui-tree-node ng-include="'nodes_renderer.HTML'">                    </li>                </ol>            </script>            <div >                <div ui-tree ID="tree-root">                    <ol ui-tree-nodes="" ng-model="data">                        <li ng-repeat="node in data" ui-tree-node ng-include="'nodes_renderer.HTML'"></li>                    </ol>                </div>            </div>        </div>        <div >            <h3>Data binding</h3>            <div >                {{info}}            </div>            <pre >{{ data | Json }}</pre>        </div>    </div></div>app.controller('supplierCtrl',['$scope','supplierService',function ($scope,supplierService) {$scope.remove = function (scope) {    scope.remove();};$scope.toggle = function (scope) {    scope.toggle();};$scope.moveLastToTheBegginig = function () {    var a = $scope.data.pop();    $scope.data.splice(0,a);};$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: []    });};$scope.newItem = function () {    $scope.data.push({        ID: makeID(),Title: 'New Point',nodes: []    });};//$scope.uploadfile = function (scope) {//    var x = scope;//};var getRootNodesScope = function () {    return angular.element(document.getElementByID('tree-root')).scope();};$scope.collapseAll = function () {    var scope = getRootNodesScope();    scope.collapseAll();};$scope.expandAll = function () {    var scope = getRootNodesScope();    scope.expandAll();};function makeID() {    var text = '';    var possible = 'ABCDEFGHIJKLMnopQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';    for (var i = 0; i < 5; i++) {        text += possible.charat(Math.floor(Math.random() * possible.length));    }    return text;}$scope.data = [{"Title": "adsfff adsf","ID": "0","nodes": [  {      "Title": "sss","ID": "1","nodes": []  },{      "ID": 3,"Title": "sdf Consultation",{      "ID": 10,"Title": "asdf",{      "Title": "sssadf","ID": "3",{      "ID": 4,{      "ID": 5,{      "ID": 6,"Title": "adsf ddd","nodes": []  }]},{"ID": 7,"Title": "dddsadf","nodes": [  {      "ID": 70,"Title": "dadsfmme",{      "ID": 71,"Title": "adsfffe","nodes": []  }]}];}]);

解决方法 >将AngularJs控制器添加到您的代码中

<div  ng-controller="supplierCtrl">

这将使它击中控制器.

如果这不能解决问题,请向AngularJs代码的切换功能添加Js警报

$scope.toggle = function (scope) {    alert('toggle function fired');    scope.toggle();};

使用此技术,您可以逐步执行角度代码并找出问题所在.系统地这样做直到找到问题为止.

总结

以上是内存溢出为你收集整理的html – Angular treeview节点上的按钮不起作用全部内容，希望文章能够帮你解决html – Angular treeview节点上的按钮不起作用所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。