fix(igxGrid): SelectedRowsChange for two-way bind. (#14745)

Author: MayaKirova

projects/igniteui-angular/src/lib/grids/grid-base.directive.ts

@@ -989,6 +989,11 @@ export abstract class IgxGridBaseDirective implements GridType,
     @Output()
     public expansionStatesChange = new EventEmitter<Map<any, boolean>>();
 
+    /* blazorInclude */
+    /** @hidden @internal */
+    @Output()
+    public selectedRowsChange = new EventEmitter<any[]>();
+
     /**
      * Emitted when the expanded state of a row gets changed.
      *
@@ -2458,7 +2463,7 @@ export abstract class IgxGridBaseDirective implements GridType,
 
     /* blazorByValueArray */
     /* blazorAlwaysWriteback */
-    /* @tsTwoWayProperty (true, "RowSelectionChanging", "Detail.NewSelection", false) */
+    /* @tsTwoWayProperty (true, "SelectedRowsChange", "Detail", false) */
     /* blazorPrimitiveValue */
     /**
      * Gets/Sets the current selection state.
@@ -3412,6 +3417,9 @@ export abstract class IgxGridBaseDirective implements GridType,
         this._transactions = this.transactionFactory.create(TRANSACTION_TYPE.None);
         this._transactions.cloneStrategy = this.dataCloneStrategy;
         this.cdr.detach();
+        this.selectionService.selectedRowsChange.pipe(takeUntil(this.destroy$)).subscribe((args: any[]) => {
+            this.selectedRowsChange.emit(args);
+        });
         IgcTrialWatermark.register();
     }
 

projects/igniteui-angular/src/lib/grids/selection/selection.service.ts

@@ -33,7 +33,7 @@ export class IgxGridSelectionService {
     /**
      * @hidden @internal
      */
-    public selectedRowsChange = new Subject<void>();
+    public selectedRowsChange = new Subject<any[]>();
 
     /**
      * Toggled when a pointerdown event is triggered inside the grid body (cells).
@@ -561,14 +561,14 @@ export class IgxGridSelectionService {
         }
         rowIDs.forEach(rowID => this.rowSelection.add(rowID));
         this.clearHeaderCBState();
-        this.selectedRowsChange.next();
+        this.selectedRowsChange.next(rowIDs);
     }
 
     /** Deselect specified rows. No event is emitted. */
     public deselectRowsWithNoEvent(rowIDs: any[]): void {
         this.clearHeaderCBState();
         rowIDs.forEach(rowID => this.rowSelection.delete(rowID));
-        this.selectedRowsChange.next();
+        this.selectedRowsChange.next(this.getSelectedRows());
     }
 
     public isRowSelected(rowID): boolean {
@@ -689,7 +689,7 @@ export class IgxGridSelectionService {
         this.rowSelection.clear();
         this.indeterminateRows.clear();
         this.clearHeaderCBState();
-        this.selectedRowsChange.next();
+        this.selectedRowsChange.next([]);
     }
 
     /** Returns all data in the grid, with applied filtering and sorting and without deleted rows. */

projects/igniteui-angular/src/lib/grids/tree-grid/tree-grid-selection.service.ts

@@ -58,7 +58,7 @@ export class IgxTreeGridSelectionService extends IgxGridSelectionService {
             this.indeterminateRows = new Set(this.rowsToBeIndeterminate);
             // TODO: emit selectionChangeD event, calculate its args through the handleAddedAndRemovedArgs method
             this.clearHeaderCBState();
-            this.selectedRowsChange.next();
+            this.selectedRowsChange.next(this.getSelectedRows());
             return;
         }
         const newParents = new Set<any>();
@@ -89,7 +89,7 @@ export class IgxTreeGridSelectionService extends IgxGridSelectionService {
         this.rowSelection = new Set(this.rowsToBeSelected);
         this.indeterminateRows = new Set(this.rowsToBeIndeterminate);
         this.clearHeaderCBState();
-        this.selectedRowsChange.next();
+        this.selectedRowsChange.next(this.getSelectedRows());
     }
 
     private cascadeDeselectRowsWithNoEvent(rowIDs: any[]): void {
@@ -99,7 +99,7 @@ export class IgxTreeGridSelectionService extends IgxGridSelectionService {
         this.rowSelection = new Set(this.rowsToBeSelected);
         this.indeterminateRows = new Set(this.rowsToBeIndeterminate);
         this.clearHeaderCBState();
-        this.selectedRowsChange.next();
+        this.selectedRowsChange.next(this.getSelectedRows());
     }
 
     public get selectionService(): IgxGridSelectionService {
@@ -134,7 +134,7 @@ export class IgxTreeGridSelectionService extends IgxGridSelectionService {
             this.rowSelection = new Set(this.rowsToBeSelected);
             this.indeterminateRows = new Set(this.rowsToBeIndeterminate);
             this.clearHeaderCBState();
-            this.selectedRowsChange.next();
+            this.selectedRowsChange.next(this.getSelectedRows());
         } else {
             // select the rows within the modified args.newSelection with no event
             this.cascadeSelectRowsWithNoEvent(newSelectionIDs, true);