how to initialize primeng tree component

前端 未结 3 1459
春和景丽
春和景丽 2021-02-06 19:37

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

I already tried to get a reference with @ViewChildren(Tree) tree

3条回答
  •  北恋
    北恋 (楼主)
    2021-02-06 20:16

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

    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...   
    }
    

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

提交回复
热议问题