We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback
What’s New in Syncfusion Angular UI Components

ESSENTIAL STUDIO 2021 VOLUME 3

What’s New in Syncfusion Angular UI Components

The third release of the year improves Syncfusion’s Angular suite with Angular 12 support, a new Breadcrumb component, and a new Bootstrap 5 theme.

Common

Angular 12 support

Angular 12 compatibility has been provided to our Angular components.

New Bootstrap v5.0 theme

The Bootstrap5 CSS theme has been added to all the Syncfusion JS 2 Angular components.

Bootstrap5 CSS.

The new Breadcrumb component is a graphical user interface that helps to identify or highlight the current location within the hierarchical structure of a website.

Syncfusion Angular Breadcrumb component preview.

Chart

Fixed column width

Specify a fixed width for data points in rectangular chart types such as bar, range column, and column.

Fixed column width.

DataManager

GraphQL Adaptor

This feature allows users to fetch data and perform actions like CRUD, filter, sort, etc. using GraphQL APIs through the adaptor support of the Data Manager.

Word Processor

Table position

This feature preserves tables with position properties when viewing a Word document.

Table position in Word document.

Paragraph pagination properties

This feature allows the user to enable or disable the following pagination properties for the paragraphs in a Word document:

  • Widow/Orphan control
  • Keep with next
  • Keep lines together

Paragraph pagination properties in Word documents.

Text measuring improvement

This feature improves the accuracy of text size measurements such as to match Microsoft Word pagination for most Word documents.

Server-side library enhancements

The server-side library now supports the following features:

  • Option to directly convert DocIO’s WordDocument to SFDT and vice-versa.
  • Word-to-SFDT conversion in Java server-side library.
  • Use new spell checker library for Java.

Custom template

This feature allows the user to visualize a custom template instead of the selected item text in the Dropdown Tree.

Custom template.

Gantt Chart

Responsive

Responsiveness will be based on the client browser’s or parent container’s width and height.

Responsive in Gantt Chart

Data Grid

Users can cause the Data Grid header to be in a fixed position when scrolling the document to visualize the Data Grid content along with the column header.

Data Grid with sticky header

Infinite Scroll with Keyboard Navigation

Keyboard accessibility support for infinite scrolling up and down using keyboard shortcut (up arrow and down arrow) keys.

Infinite scrolling with keyboard navigation in data grid

Kanban

Observable Collection

This feature allows users to perform add, update, and delete operations using observable object binding on the Kanban board.

PDF Viewer

Performance

The zooming performance of the page content was improved.

Signature

The signature dialog shows the signature options: draw, type, and image.

Signature dialog.

Pivot Table

Measures at different positions in an axis

In relational data sources, support has been provided to place measures at different positions in the row or column axis through code or user interaction via the grouping bar and field list.

Measures at different positions in Angular Pivot Table

Query Builder

Complex data binding support with Dropdown Tree

This feature allows users to create subfields for columns by specifying either a complex data source or nested columns. A Dropdown Tree component is rendered for the field option to select nested columns.

Complex data binding.

Rich Text Editor

Enter Key Customization

This feature allows customization of tags appended when enter or shift + enter keys are pressed using enterKey and shiftEnterKey properties in the Rich Text Editor.

Scheduler

Header indent template

This feature provides a template to indent the header cells.

Header indent template in Angular Scheduler.

Custom sort comparer

Users can customize the default sort action for overlapping appointments by writing their own sorting logic.

Spreadsheet

Autofill feature

This feature allows users to easily fill or copy a series or pattern of values and formats into adjacent cells in any direction.

Autofill.

Password protection for worksheets

This feature allows users to protect a worksheet by encrypting it with a password.

Protect sheet.

Formula values in data validation input

This feature allows users to provide formula values in data validation input while applying data validation in a spreadsheet.

Data validation

Custom number formatting

This feature allows users to customize the display format of numbers, dates, times, percentages, and currency values.

Custom format

Toast

Utility function

Display a simple toast in any place using the utility function.

Toast utility with model values

    ToastUtility.show({​​​​​​​
        title: 'Toast Title',
        content: 'Toast Content',
        timeOut: 5000,
        showCloseButton: true
    }​​​​​​​);

Toast utility as string value


ToastUtility.show('Toast Content Error Message', 'Success', 5000);

Tree Grid

Freeze Direction

Freeze columns in any direction, left, right, or both sides.

Freeze Direction in Tree Grid

Visual Studio Code Extensions

Code Snippet

The Syncfusion Angular Snippets utility provides code snippets for inserting a Syncfusion Angular component into an Angular application’s HTML file. These Angular code snippets will help you accelerate the development of an Angular application. You can access the Syncfusion Angular code snippets by typing the Syncfusion Angular components keyword, beginning with “ejs-” in the HTML file, as shown in the following image.

Syncfusion Angular Code Snippets

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon