Articles in this section
Category / Section

How to check whether an Angular Spreadsheet has undo and redo collections programmatically?

3 mins read

This knowledge base article explains how to check whether an Angular Spreadsheet has undo and redo collections programmatically. On a button click event, you can retrieve the undo and redo collections from the spreadsheet’s undo/redo module. You can confirm the undo and redo collection’s availability based on the collection length.

[app.component.html]

<button class="e-btn" (click)="checkUndoRedo()">Check undo/redo</button>
   <ejs-spreadsheet #spreadsheet>
       <e-sheets>
           <e-sheet name="Car Sales Report">
               <e-ranges>
                   <e-range [dataSource]="data"></e-range>
               </e-ranges>
               <e-columns>
                   <e-column [width]=180></e-column>
                   <e-column [width]=130></e-column>
                   <e-column [width]=130></e-column>
                   <e-column [width]=180></e-column>
                   <e-column [width]=130></e-column>
                   <e-column [width]=120></e-column>
               </e-columns>
           </e-sheet>
       </e-sheets>
   </ejs-spreadsheet>

[app.component.ts]

import { SpreadsheetModule } from '@syncfusion/ej2-angular-spreadsheet';
import { Component, ViewEncapsulation, ViewChild } from '@angular/core';
import { getDefaultData } from './data';
import { SpreadsheetComponent } from '@syncfusion/ej2-angular-spreadsheet';

@Component({
   standalone: true,
   imports: [ SpreadsheetModule ],
   selector: 'app-root',
   templateUrl: 'app.component.html',
   styleUrls: ['app.component.css'],
   encapsulation: ViewEncapsulation.None
})

export class AppComponent {
   @ViewChild('spreadsheet')
   // Get the instance of the Spreadsheet.
   spreadSheetInstance: SpreadsheetModule;
   public spreadsheetObj!: SpreadsheetComponent;
   public data: Object[] = getDefaultData();
   checkUndoRedo(){
       // Check whether the undo collection has been updated with the data.
       let isUndo: boolean = this.spreadSheetInstance['undoredoModule'].undoCollection.length > 0;
       // Check whether the redo collection has been updated with the data.
       let isRedo: boolean = this.spreadSheetInstance['undoredoModule'].redoCollection.length > 0;
       // Log the expected state to the console.
       console.log("Is undo action available: " + isUndo);
       console.log("Is redo action available: " + isRedo);
   }
}

Sample Link:

https://stackblitz.com/edit/angular-an9rqp-cgyex8?file=src%2Fapp.component.ts

Output:

Undo-redo_collections.gif

For further information about this, see the documentation that follows.

https://ej2.syncfusion.com/angular/documentation/spreadsheet/undo-redo

Conclusion
I hope you enjoyed learning about how to split multiple sheets containing Spreadsheet into individual Excel files with each sheet in Angular Spreadsheet.

You can refer to our Angular Spreadsheet’s feature tour page to know about its other groundbreaking feature representations and documentations. You can also explore our Angular Spreadsheet example to understand how to present and manipulate data.

For current customers, you can check out our Angular components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our Angular Spreadsheet and other Angular components.

If you have any queries or require clarifications, please let us know in comments below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied