Angular-Kendo TreeViewを使用して、ページロード時に要素を拡張する方法?

StackOverflow https://stackoverflow.com//questions/22053387

  •  21-12-2019
  •  | 
  •  

質問

私のページに宣言されているAngular-Kendo Treeviewがあります。

<div id="treeview" kendo-tree-view="ktv" k-options="treeDataScope"></div>
.

ページのロード時にルートノードを拡張します。Angular Kendoの例はいくつかあります。剣道UIの例は、このようなことをするように言う:

var treeview = $("#treeview").data("kendoTreeView");
// expand the item with text "foo"
treeview.expand(treeview.findByText("foo"));

// expand all loaded items
treeview.expand(".k-item");
.

私は(明らかに)そのようにツリービューを宣言していないので、「TreeView」を参照していないため、その参照を受けることができるように見えないようです。「TreeView」DIVへの参照を取得できますが、「findBytext」メソッドを持つ剣道「TreeView」への参照方法を理解することはできません。

その方法を見つけることができたかどうかを確認しようとしました、私は以下のようにしてみました:

$("#treeview").findByText;
$("#treeview").kendoTreeView().findByText;
angular.element("#treeview").findByText;
angular.element("#treeview").kendoTreeView().findByText;
.

しかし、すべて不定として終わる。

あらゆる助けが理解されるでしょう!

役に立ちましたか?

解決

data-expanded 属性を使用できます。

例えば:

<ul kendo-tree-view>
    <li data-expanded="true">
        Products
.

または(動的にするための角度式を使用して):

<ul kendo-tree-view>
    <li data-expanded="{{$state.includes('products')}}">
        Products
.

またはデータソースからツリービューを動的に動的に入力している場合は、展開データ項目オプション、e.g。:

$("#treeview").kendoTreeView({
    dataSource: {
        data: [{
            text: "Products", 
            expanded: true, 
            items: [{ text: "X" }, { text: "Y" }, { text: "Z" }] 
        }]
    }
})
.

他のヒント

I'm not so sure about angular, but with plain old kendo, you get a reference to the treeView like this:

var treeview = $("#treeview").data("kendoTreeView");
var node = treeView.findByText('node text');            
treeView.expand(node);

You can use some other methods to find the node, but if you know the text, that should be easiest. Now, if you are using angular, this may not be correct, but i wouldn't think that would cause the tree view api to behave differently.

I think the only piece you may be missing is how to get a reference to the treeview, that is what this does:

var treeview = $("#treeview").data("kendoTreeView");

See also: Another answer I gave on expanding a node

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top