dom - プライムツリーコンポーネントを初期化する方法

Question

ノードが自由に展開されるように初期化するtree方法を考えてみてください。

私はすでに参照を取得しようとしましたが、彼の子供にアクセスしようとすると参照@ViewChildren(Tree) treeが発生しますundefined

Answer 1

これは、基本的にツリーに沿ったクリックをシミュレートするハックです。私はこの解決策を追加しますが、誰かがもっと良いものを見つけてくれることを本当に願っています.

を持つコンポーネントを指定するとtree、 への参照を取得しtreenodes、必要に応じてそれらを「クリック」できます。

@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関数をネストする必要があります。