1

我正在尝试使用angular-ui-tree来渲染树。当我拖动“baz”节点时,在“bar”节点下我得到Uncaught TypeError: Cannot read property '$$phase' of null. 将任何其他节点拖到任何其他位置都可以正常工作。

我不明白错误消息的含义。我是角度的新手。

这是我的代码:

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

4 回答 4

2

Solution provided by andersManden at github issues seems to be the working solution,

   $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-12T07:59:23.787 回答
0

当只有一个父母和一个孩子并稍微拖动父母时,我遇到了同样的错误。

这棵树在一个带有 ng-if 的 div 中,当没有元素时它从 DOM 中删除了这棵树。

使用 ng-show 解决了我的问题。

于 2015-02-08T20:46:26.483 回答
0

我遇到了同样的错误,就我而言,这是因为并非我的数组中的所有项目都具有“儿童”属性。一旦我为每个项目添加了一个子数组(即使子数组为空),错误就停止了。希望这可以帮助!

于 2015-01-20T21:06:45.437 回答
0

I have tried to reproduce the error, but I am not able to reproduce, can you paste the exact error you are getting and when ?

于 2014-11-19T06:10:09.403 回答