当提供选项属性时,angular-tree-control不呈现数据

时间:2016-01-26 06:18:39

标签: javascript angularjs

我正在使用angular-tree-control,我尝试了一些示例,它工作正常,但是当我添加options属性以启用multiSelect时,它不再渲染树控件了。 Here就是我所做的。

如果删除选项属性,则可以正常工作。

 

angular.module('app', ['treeControl'])
  .controller('myController', function() {

  })
  .directive('treeview', function() {
    return {
      templateUrl: 'temp.html',
      link: function($scope, elem, attr) {
        $scope.treeOptions = {
          multiSelection: true
        };
        $scope.selectedNodes = [];
        $scope.treedata = createSubTree(3, 4, "");

        $scope.lastClicked = null;

        function createSubTree(level, width, prefix) {
          if (level > 0) {
            var res = [];
            for (var i = 1; i <= width; i++)
              res.push({
                "label": "Node " + prefix + i,
                "id": "id" + prefix + i,
                "i": i,
                "children": createSubTree(level - 1, width, prefix + i + ".")
              });
            return res;
          } else
            return [];
        }
      }
    }
  });
.chzntree-search-results .treeselect-title {
  margin-left: 41px !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://wix.github.io/angular-tree-control/angular-tree-control.js"></script>

<link href="https://wix.github.io/angular-tree-control/css/tree-control.css" />
<link href="https://wix.github.io/angular-tree-control/css/tree-control-attribute.css" />

<div ng-app="app">
  <div ng-controller="myController">
    <span treeview></span>
  </div>
  <script type="text/ng-template" id="temp.html">
    <treecontrol class="tree-classic" tree-model="treedata" selected-nodes="selectedNodes" on-selection="showSelected(node, selected)" options="treeOptions">
      label: {{node.label}} ({{node.id}})
    </treecontrol>
  </script>
</div>

1 个答案:

答案 0 :(得分:0)

我更新为here

在DOM渲染之前处理树模型

   compile: function compile(elem, attrs) {
   return {
                pre: function preLink($scope, element, attributes) {
   $scope.treeOptions = {multiSelection: true};
        $scope.treedata=createSubTree(3, 4, "");
        $scope.selectedNodes = [];


    function createSubTree(level, width, prefix) {
      if (level > 0) {
        var res = [];
        for (var i = 1; i <= width; i++)
          res.push({
            "label": "Node " + prefix + i,
            "id": "id" + prefix + i,
            "i": i,
            "children": createSubTree(level - 1, width, prefix + i + ".")
          });
        return res;
      } else
        return [];
    }
  }
};

}