Treeview doesn't expand....why?

[Ashish]

After running this it selects "Mike" but It does not expand. Am I missing anything!!

 

<kendo-treeview
  [nodes]="data"
  textField="text"
  kendoTreeViewHierarchyBinding
  childrenField="items"
  [filterable]="true"
  kendoTreeViewExpandable
  [expandedKeys]="expandedKeys"
  kendoTreeViewCheckable
  [(checkedKeys)]="checkedKeys"
>
</kendo-treeview>

import { Component } from '@angular/core';
import { Observable, of } from 'rxjs';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent {
  title = 'kendo-appx';

  public fetchChildren(node: any): Observable<any[]> {
    //Return the items collection of the parent node as children.
    return of(node.items);
  }

  public hasChildren(node: any): boolean {
    //Check if the parent node has children.
    return node.items && node.items.length > 0;
  }

  public expandedKeys: any[] = ['2', '0', '1', '3'];

  public checkedKeys: any[] = ['2_0_0_1'];

  public data: any[] = [
    {
      text: 'Furniture',
      items: [{ text: 'Tables' }, { text: 'Sofas', items: [{ text: 'Red' }] }],
    },
    {
      text: 'Decor',
      items: [{ text: 'Curtains' }, { text: 'Carpets' }],
    },
    {
      text: 'RH',
      items: [
        {
          text: 'Magdelena',
          items: [
            {
              text: 'Joel',
              items: [
                {
                  text: 'Ashish',
                },
                {
                  text: 'Mike',
                },
              ],
            },
          ],
        },
      ],
    },
  ];
}

[Hetali]

Hi Ashish,

To expand the checked key when the page loads, you will have to expand all the parent keys of that key. For example:

public checkedKeys: any[] = ['2_0_0_1'];
public expandedKeys: any[] = ['2', '2_0', '2_0_0'];
  

In this example, the checked key of the TreeView is exapnded.

I hope this helps.

Regards,
Hetali
Progress Telerik