如何初始化primeng树组件 [英] how to initialize primeng tree component

问题描述

给定一个树如何以这样的方式初始化它们，以便节点随意扩展？

Given a tree how to initialize it in such way that the nodes are expanded at will?

I已经尝试使用 @ViewChildren（Tree）树获得引用，但是在尝试访问他的时候导致未定义的引用孩子

I already tried to get a reference with @ViewChildren(Tree) tree but is resulting in undefined references when trying to access his children

推荐答案

这是一个基本上模拟树上点击的黑客。我添加了这个解决方案，但我真的希望有人可以找到更好的东西。

This is a hack that basically simulates clicks along the tree. I add this solution but I really hope someone could find something better.

给定一个包含树的组件获得 treenodes 的引用，然后根据需要点击：

Given a component with a tree we can get a reference to the treenodes and then "click" them as necessary:

@Component({
    selector: 'filemanager',
    templateUrl: './filemanager.html',
    directives: [Tree]
})
export class FileManagerComponent implements AfterViewInit {

    constructor(private renderer:Renderer) {}    

    ngAfterViewInit() {
        setTimeout(() => { // a timeout is necessary otherwise won't find the elements

            // get the first "p-tree" tag and find his first "toggler"
            let element = document.getElementsByTagName("p-tree")[0].getElementsByClassName("ui-tree-toggler fa fa-fw fa-caret-right")[0];

            //"click" the toggler using the angular2 renderer 
            let event = new MouseEvent('click', {bubbles: true});
            this.renderer.invokeElementMethod(element, 'dispatchEvent', [event]);
        }, 200);
    }

    // more methods and state...   
}

如果需要在树中初始化较深的节点，则需要嵌套 setTimeout 函数。

In case you need to initialize deeper nodes in the tree you will need to nest setTimeout functions.

这篇关于如何初始化primeng树组件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！