emit "sorting-changed" DOM event (DataTable) (#2916)

lib/core/datatable/components/datatable/datatable.component.spec.ts

@@ -51,6 +51,27 @@ describe('DataTable', () => {
         element = fixture.debugElement.nativeElement;
     });
 
+    it('should emit "sorting-changed" DOM event', (done) => {
+        const column = new ObjectDataColumn({ key: 'name', sortable: true, direction: 'asc' });
+        dataTable.data = new ObjectDataTableAdapter(
+            [
+                { name: '1' },
+                { name: '2' }
+            ],
+            [ column ]
+        );
+        dataTable.data.setSorting(new DataSorting('name', 'desc'));
+
+        fixture.nativeElement.addEventListener('sorting-changed', (event: CustomEvent) => {
+            expect(event.detail.key).toBe('name');
+            expect(event.detail.direction).toBe('asc');
+            done();
+        });
+
+        dataTable.ngOnChanges({});
+        dataTable.onColumnHeaderClick(column);
+    });
+
     it('should change the rows on changing of the data', () => {
         let newData = new ObjectDataTableAdapter(
             [

lib/core/datatable/components/datatable/datatable.component.ts

@@ -369,6 +369,7 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck
                 newDirection = current.direction === 'asc' ? 'desc' : 'asc';
             }
             this.data.setSorting(new DataSorting(column.key, newDirection));
+            this.emitSortingChangedEvent(column.key, newDirection);
         }
     }
 
@@ -519,4 +520,15 @@ export class DataTableComponent implements AfterContentInit, OnChanges, DoCheck
         });
         this.elementRef.nativeElement.dispatchEvent(domEvent);
     }
+
+    private emitSortingChangedEvent(key: string, direction: string) {
+        const domEvent = new CustomEvent('sorting-changed', {
+            detail: {
+                key,
+                direction
+            },
+            bubbles: true
+        });
+        this.elementRef.nativeElement.dispatchEvent(domEvent);
+    }
 }