Merge pull request #3260 from IgniteUI/vNext

merge vNext into master

Author: zdrawku

src/app/data-entries/dropdown/dropdown-tree-grid-hierarchical-selection/dropdown-tree-grid-hierarchical-selection.component.ts

@@ -17,6 +17,10 @@ export class DropdownTreeGridHierarchicalSelectionComponent implements OnInit {
 
     public ngOnInit(): void {
         this.employees = EMPLOYEE_DATA;
+        
+        this.igxTreeGrid.selectRows([1,4], true); 
+        this.selectedRows = [];
+        this.igxTreeGrid.selectedRows.forEach((row) => this.selectedRows.push(this.employees.find(employee => employee.ID == row)));
     }
 
     public onRowSelectionChanging(args: IRowSelectionEventArgs, grid: IgxTreeGridComponent) {
@@ -34,6 +38,6 @@ export class DropdownTreeGridHierarchicalSelectionComponent implements OnInit {
     }
 
     public handleClosing(event: IBaseCancelableBrowserEventArgs) {
-        event.cancel = event.event.composedPath().some(e => (e as HTMLElement).nodeName.toLowerCase() === 'igx-chip');
+        event.cancel = event.event.composedPath().some(e => (e as HTMLElement).nodeName?.toLowerCase() === 'igx-chip');
     }
 }

src/app/data-entries/dropdown/dropdown-tree-hierarchical-selection/dropdown-tree-hierarchical-selection.component.html

@@ -11,7 +11,7 @@
 
 <igx-drop-down #countriesDropDown [height]="'500px'" [width]="'300px'" (closing)="handleClosing($event)">
     <igx-tree #igxTree selection="BiState" (nodeSelection)="onNodeSelection($event)">
-        <igx-tree-node *ngFor="let country of countries" [data]="country" [expanded]="true">
+        <igx-tree-node *ngFor="let country of countries" [data]="country" [expanded]="true" [selected]="true">
             {{ country.Name }}
             <igx-tree-node *ngFor="let city of country.Cities" [data]="city">
                 {{ city.Name }}

src/app/data-entries/dropdown/dropdown-tree-hierarchical-selection/dropdown-tree-hierarchical-selection.component.ts

@@ -1,5 +1,5 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
-import { IBaseChipEventArgs, IgxChipComponent, IgxTreeComponent, ITreeNodeSelectionEvent } from 'igniteui-angular';
+import { Component, DoCheck, OnInit, ViewChild } from '@angular/core';
+import { IBaseChipEventArgs, IgxTreeComponent, ITreeNodeSelectionEvent } from 'igniteui-angular';
 import { IBaseCancelableBrowserEventArgs } from 'igniteui-angular/lib/core/utils';
 import { COUNTRIES } from './countries';
 @Component({
@@ -8,7 +8,7 @@ import { COUNTRIES } from './countries';
     styleUrls: ['./dropdown-tree-hierarchical-selection.component.scss'],
     templateUrl: './dropdown-tree-hierarchical-selection.component.html'
 })
-export class DropdownTreeHierarchicalSelectionComponent implements OnInit {
+export class DropdownTreeHierarchicalSelectionComponent implements OnInit, DoCheck {
     @ViewChild('igxTree', { static: true })
     public igxTree: IgxTreeComponent;
 
@@ -19,6 +19,10 @@ export class DropdownTreeHierarchicalSelectionComponent implements OnInit {
         this.countries = COUNTRIES;
     }
 
+    public ngDoCheck(){
+        this.selectedNodes = this.igxTree.nodes?.filter(node => node.selected == true);
+    }
+
     public onNodeSelection(args: ITreeNodeSelectionEvent) {
         this.selectedNodes = args.newSelection;
     }
@@ -33,6 +37,6 @@ export class DropdownTreeHierarchicalSelectionComponent implements OnInit {
     }
 
     public handleClosing(event: IBaseCancelableBrowserEventArgs) {
-        event.cancel = event.event.composedPath().some(e => (e as HTMLElement).nodeName.toLowerCase() === 'igx-chip');
+        event.cancel = event.event.composedPath().some(e => (e as HTMLElement).nodeName?.toLowerCase() === 'igx-chip');
     }
 }