角UI樹拖動不工作

我想用angular-ui-tree來渲染樹。當我拖動「baz」節點時，在「bar」節點下，我得到Uncaught TypeError: Cannot read property '$$phase' of null。將任何其他節點拖到任何其他位置都可以正常工作。角UI樹拖動不工作

我不明白錯誤信息的含義。我是新來的角。

這裏是我的代碼：

http://plnkr.co/edit/G3dHRluoAmjiTmPmBZr2?p=preview

<!DOCTYPE html> 
<html> 
    <head> 
    <link rel="stylesheet" href="https://cdn.rawgit.com/JimLiu/angular-ui-tree/master/dist/angular-ui-tree.min.css"> 

    <style> 
     .angular-ui-tree-placeholder { 
      background: #f0f9ff; 
      border: 2px dashed #bed2db; 
     } 
     .angular-ui-tree-handle { 
      background: #f8faff; 
      border: 1px solid #dae2ea; 
      color: #7c9eb2; 
      padding: 10px 10px; 
     } 

    </style> 

    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.26/angular.min.js"></script> 
    <script type="text/javascript" src="https://cdn.rawgit.com/JimLiu/angular-ui-tree/master/dist/angular-ui-tree.min.js"></script> 
    </head> 
    <body ng-app="treeApp"> 
    <div class="tree_section" ng-controller="treeCtrl"> 

     <!-- Nested node template --> 

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

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

     <p>top_ids: {{top_ids}}</p> 

     <script> 
     var treeApp = angular.module("treeApp", ['ui.tree']); 

     treeApp.controller('treeCtrl', ['$scope', 
     function($scope) { 

      $scope.nodes = { 
      '1': { 
       'text': 'foo', 
       'child_ids': ['2'], 
      }, 
      '2': { 
       'text': 'bar', 
       'child_ids': [], 
      } 
      } 
      $scope.top_ids = ['1'] 

      $scope.nodes['3'] = { 
      text:'baz', child_ids:[] 
      } 
      $scope.nodes['1'].child_ids.push('3'); 
     } 
     ]); 

     </script> 
    </div> 
    </body> 
</html>

來源

2014-11-01 Jesse Aldridge

解決方案似乎是工作液，

$scope.safeApply = function(fn) { 
     var phase = this.$root.$$phase; 
     if(phase == '$apply' || phase == '$digest') { 
     if(fn && (typeof(fn) === 'function')) { 
      fn(); 
     } 
     } else if(phase == null){ 
      fn(); 
     } else { 
     this.$apply(fn); 
     } 
    };

來源

2015-03-12 07:59:23 Shahroon

鏈接到提到的評論：https：//github.com/angular-ui-tree/angular-ui-tree/issues/270#issuecomment-68594119 – 2015-03-13 00:22:55

我試圖重現錯誤，但我無法重現，可以粘貼你得到，當確切的錯誤？

來源

2014-11-19 06:10:09 Justin

我創建了一個plunkr，看到上面的代碼的鏈接。只需嘗試在標記爲「bar」的節點下拖拽標記爲「baz」的節點，然後再執行其他任何操作，並且您可以看到它無法按預期工作。 – 2014-11-19 06:55:28

我得到了同樣的錯誤，在我的情況下，這是因爲我的數組中沒有所有的項目都有「children」屬性。一旦我爲每個項目添加了一個子數組（即使子數組爲空），錯誤也會停止。希望這可以幫助！

來源

2015-01-20 21:06:45 dzg

當只有一個父級父母並且有一點拖拽父母時，我有同樣的錯誤。

這棵樹是在一個帶有ng-if的div裏面的，當沒有元素的時候，這個樹從DOM上移除了樹。

用ng-show代替我的問題。通過andersManden在GitHub上的問題提供

來源

2015-02-08 20:46:26 jbetancourt

角UI樹拖動不工作

回答

相關問題