Prime NG:打字稿中的树propagationSelectionUp

时间:2018-07-10 09:02:45

标签: angular typescript tree primeng

我是一名初学者,致力于使用JHipster构建的应用程序,并使用Angular 4.3和PrimeNG。 我有一棵树和一个搜索栏。

当我单击打开我的树时,复选框很好,如下所示: Tree opened with clicks

但是我有一个问题,当我在搜索栏中进行研究时,我会使用打字稿代码手动打开树,并且在将正确的叶子放在所选节点中时,它不会检查国家和大洲(父节点):

Tree opened in typescript

这是我的HTML代码:

    <jhi-search-bar [data]="items" (onItemSelected)="openNodeAfterSearch($event)"></jhi-search-bar>
    <p-tree class="arbre"
                        [loading]="loading"
                        [value]="nodes"
                        selectionMode="checkbox"
                        (onNodeSelect)="onChange()"
                        (onNodeUnselect)="onChange()"
                        [(selection)]="selectedNodes"></p-tree>

这是我的TS代码:

openNodeAfterSearch(item: any) {
    const racine = this.nodes[0];
    // I close all unecessary opened nodes
    for (const continent of racine.children) {
        continent.expanded = false;
        for (const country of continent.children) {
            country.expanded = false;
            for (const item of country.children) {
                if (item.data.id === item.item.id) { // right node to open

                    this.selectedNodes = [];
                    this.selectedNodes.push(item);

                    country.expanded = true; // open parent's node
                    continent.expanded = true;
                }
            }
        }
    }
}

我已经尝试过此HTML属性,但失败了:

[propagateSelectionUp]="true" 

我也不想这样:

this.selectedNodes.push(country);
this.selectedNodes.push(continent);

因为我得到了:

All in selectedNodes

有人有想法吗?

朱莉。

2 个答案:

答案 0 :(得分:0)

我找到了解决方法:

country.partialSelected = true;
continent.partialSelected = true;

只需添加一些条件即可检查是否选择了所有子项。

答案 1 :(得分:0)

已解决 :) !!!!!!!!!

您应该在此属性中使用 括号

[propagateSelectionUp] =“ false” [propagateSelectionDown] =“ false”