### Angular Calendar - Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/calendars/README.md Provides instructions on how to get started with the Angular Calendar component. This typically involves installation and basic setup. ```bash ng add @syncfusion/ej2-angular-calendars ``` -------------------------------- ### Angular DatePicker - Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/calendars/README.md Provides instructions on how to get started with the Angular DatePicker component. This typically involves installation and basic setup. ```bash ng add @syncfusion/ej2-angular-calendars ``` -------------------------------- ### Syncfusion Charts Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Documentation for the Syncfusion Charts component for Angular. Covers installation, configuration, and basic chart examples. ```angular https://ej2.syncfusion.com/angular/documentation/chart/getting-started/ ``` -------------------------------- ### Syncfusion Bullet Chart Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides documentation for getting started with the Syncfusion Bullet Chart component for Angular. Includes setup and basic usage instructions. ```angular https://ej2.syncfusion.com/angular/documentation/bullet-chart/getting-started/ ``` -------------------------------- ### Setup Angular Application Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/pivotview/README.md Installs the Angular CLI globally and creates a new Angular application. Navigate into the application directory. ```bash npm install -g @angular/cli g ``` ```bash ng new my-app cd my-app ``` -------------------------------- ### Setup Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/richtexteditor/README.md Installs the Angular CLI globally, which is used for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Syncfusion Angular Ribbon Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/ribbon/README.md Installs the Syncfusion Angular Ribbon component and its dependent packages using npm. This is the initial setup step for using the component in an Angular project. ```sh npm install @syncfusion/ej2-angular-ribbon --save ``` -------------------------------- ### Syncfusion Angular Chips Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides access to the documentation for the Syncfusion Angular Chips component. This includes getting started guides, API references, and usage examples. ```APIDOC Angular Chips: Documentation: https://ej2.syncfusion.com/angular/documentation/chips/getting-started/ NPM Package: @syncfusion/ej2-angular-buttons Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/chips/default Source: src/buttons/src/chips ``` -------------------------------- ### Syncfusion Sparkline Charts Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Guide to getting started with Syncfusion Sparkline Charts for Angular. Learn how to create compact charts for displaying data trends. ```angular https://ej2.syncfusion.com/angular/documentation/sparkline/getting-started/ ``` -------------------------------- ### Create Angular Application Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/documenteditor/README.md This snippet demonstrates how to create a new Angular application using the Angular CLI and set up the project structure. It involves cloning a quickstart repository, navigating into the directory, and installing project dependencies. ```bash git clone https://github.com/angular/quickstart.git quickstart cd quickstart npm install ``` -------------------------------- ### Syncfusion Angular Button Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides access to the documentation for the Syncfusion Angular Button component. This includes getting started guides, API references, and usage examples. ```APIDOC Angular Button: Documentation: https://ej2.syncfusion.com/angular/documentation/button/getting-started/ NPM Package: @syncfusion/ej2-angular-buttons Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/button/default Source: src/buttons/src/button ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/kanban/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Syncfusion EJ2 Angular SplitButtons Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/splitbuttons/README.md Installs the SplitButtons package and its dependencies using npm. This is the initial setup step for using the components in an Angular project. ```sh npm install @syncfusion/ej2-angular-splitbuttons ``` -------------------------------- ### Install ej2-angular-lists Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/lists/README.md Installs the ej2-angular-lists package and its dependent packages using npm. This is the initial setup step for using the component in an Angular project. ```sh npm install @syncfusion/ej2-angular-lists ``` -------------------------------- ### Install Layout Components Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/layouts/README.md Installs the Syncfusion EJ2 Angular Layouts package and its dependencies using npm. ```sh npm install @syncfusion/ej2-angular-layouts ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/schedule/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/filemanager/README.md Installs the Angular CLI globally, which is required for creating and managing Angular projects. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/grids/README.md Installs the Angular CLI globally, which is used for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Syncfusion Angular Inputs Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/inputs/README.md Installs the `@syncfusion/ej2-angular-inputs` package and its dependent packages using npm. ```sh npm install @syncfusion/ej2-angular-inputs ``` -------------------------------- ### Install ej2-angular-inplace-editor Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/inplaceeditor/README.md Installs the In-place Editor component and its dependencies for Angular projects using npm. ```sh npm install @syncfusion/ej2-angular-inplace-editor ``` -------------------------------- ### Syncfusion Angular Split Button Components Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides access to the documentation for Syncfusion Angular split button components, including Button Group, Dropdown Menu, Progress Button, and Split Button. This includes getting started guides, API references, and usage examples. ```APIDOC Angular Button Group: Documentation: https://ej2.syncfusion.com/angular/documentation/button-group/getting-started/ NPM Package: @syncfusion/ej2-angular-splitbuttons Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/button/button-group Source: src/splitbuttons/src/button-group ``` ```APIDOC Angular Dropdown Menu: Documentation: https://ej2.syncfusion.com/angular/documentation/drop-down-button/getting-started/ NPM Package: @syncfusion/ej2-angular-splitbuttons Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/button/dropdown-button Source: src/splitbuttons/src/drop-down-button ``` ```APIDOC Angular Progress Button: Documentation: https://ej2.syncfusion.com/angular/documentation/progress-button/getting-started/ NPM Package: @syncfusion/ej2-angular-splitbuttons Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/button/progress-button Source: src/splitbuttons/src/progress-button ``` ```APIDOC Angular Split Button: Documentation: https://ej2.syncfusion.com/angular/documentation/split-button/getting-started/ NPM Package: @syncfusion/ej2-angular-splitbuttons Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/button/split-button Source: src/splitbuttons/src/split-button ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/treegrid/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install EJ2 Angular Popups Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/popups/README.md Installs the Syncfusion EJ2 Angular Popups package and its dependent packages using npm. ```sh npm install @syncfusion/ej2-angular-popups ``` -------------------------------- ### Syncfusion Stock Chart Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Documentation for the Syncfusion Stock Chart component for Angular. Covers financial data visualization, including price trends and indicators. ```angular https://ej2.syncfusion.com/angular/documentation/stock-chart/getting-started/ ``` -------------------------------- ### Install EJ2 Angular Buttons Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/buttons/README.md This command installs the EJ2 Angular Buttons package and its dependencies using npm. Ensure you have Node.js and npm installed on your system. ```sh npm install @syncfusion/ej2-angular-buttons ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/gantt/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/querybuilder/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Navigations Package Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/navigations/README.md Installs the `@syncfusion/ej2-angular-navigations` package and its dependencies using npm. This package provides the Syncfusion EJ2 Angular navigation components. ```sh npm install @syncfusion/ej2-angular-navigations ``` -------------------------------- ### Install Syncfusion EJ2 Angular Interactive Chat Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/interactivechat/README.md Installs the interactive chat package and its dependent packages using npm. ```sh npm install @syncfusion/ej2-angular-interactive-chat ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/lineargauge/README.md Installs the Angular CLI globally on your system, which is required for creating and managing Angular projects. ```bash npm install -g @angular/cli ``` -------------------------------- ### Add Syncfusion FileManager Package Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/filemanager/README.md Installs the Syncfusion Angular FileManager package and its dependencies, and configures the application module and theme. ```bash ng add @syncfusion/ej2-angular-filemanager ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/charts/README.md Installs the Angular Command Line Interface globally, which is necessary for creating and managing Angular projects. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install ej2-angular-base Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/base/README.md Installs the ej2-angular-base package and its dependencies using npm. This is the primary step to integrate Syncfusion's Angular UI components into your project. ```sh npm install @syncfusion/ej2-angular-base ``` -------------------------------- ### Basic Progress Bar Initialization Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/progressbar/README.md Demonstrates how to initialize a basic circular progress bar using the ej2-angular-progressbar component. This snippet shows the essential HTML and TypeScript setup. ```html ``` ```typescript import { Component } from '@angular/core'; @Component({ selector: 'app-root', template: '' }) export class AppComponent { title = 'progressbar'; } ``` -------------------------------- ### Syncfusion EJ2 Angular Kanban Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides access to the Syncfusion EJ2 Angular Kanban component. Includes links to the npm package for installation, source code, a live demo, and detailed documentation. ```html npm package @syncfusion/ej2-angular-kanban      code coverage of @syncfusion/ej2-angular-kanban Source Live demo Documentation ``` -------------------------------- ### Syncfusion Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/grids/README.md Provides links to showcase samples for Syncfusion Angular UI components. Includes an Expense Tracker and a Loan Calculator, with direct links to their source code repositories and live demos. ```markdown * Expense Tracker - [Source](https://github.com/syncfusion/ej2-showcase-angular-expensetracker?utm_source=npm&utm_medium=listing&utm_campaign=angular-grid-npm), [Live Demo](https://ej2.syncfusion.com/showcase/angular/expensetracker/#/dashboard?utm_source=npm&utm_medium=listing&utm_campaign=angular-grid-npm) * Loan Calculator - [Source](https://github.com/syncfusion/ej2-sample-ng-loancalculator?utm_source=npm&utm_medium=listing&utm_campaign=angular-grid-npm), [Live Demo](https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_medium=listing&utm_campaign=angular-grid-npm) ``` -------------------------------- ### Showcase Samples for ej2-angular-ui-components Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/filemanager/README.md Showcase samples demonstrate practical applications of the UI components. The provided samples include an Expense Tracker and a Loan Calculator, with links to their source code and live demos. ```text Expense Tracker - Source: https://github.com/syncfusion/ej2-showcase-angular-expensetracker?utm_source=npm&utm_medium=listing&utm_campaign=angular-filemanager-npm, Live Demo: https://ej2.syncfusion.com/showcase/angular/expensetracker/#/dashboard?utm_source=npm&utm_medium=listing&utm_campaign=angular-filemanager-npm Loan Calculator - Source: https://github.com/syncfusion/ej2-sample-ng-loancalculator?utm_source=npm&utm_medium=listing&campaign=angular-filemanager-npm, Live Demo: https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_medium=listing&utm_campaign=angular-filemanager-npm ``` -------------------------------- ### Support Channels Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/inputs/README.md Information on how to get support for Syncfusion products, including support tickets, community forums, GitHub issues, feature requests, and live chat. ```General Support ticket: https://support.syncfusion.com/support/tickets/create Community forum: https://www.syncfusion.com/forums/essential-js2?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm GitHub issues: https://github.com/syncfusion/ej2-angular-ui-components/issues/new Request feature or report bug: https://www.syncfusion.com/feedback/angular?utm_source=npm&utm_medium=listing&utm_campaign=angular-inputs-npm Live chat ``` -------------------------------- ### Syncfusion Range Selector Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Getting started guide for the Syncfusion Range Selector component in Angular. Explains how to integrate and use the component for data selection. ```angular https://ej2.syncfusion.com/angular/documentation/range-navigator/getting-started/ ``` -------------------------------- ### Support and Licensing Information Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/splitbuttons/README.md This section provides information on how to get support for Syncfusion products, including creating incidents, community forums, GitHub issues, and Stack Overflow. It also includes links to license and changelog details. ```markdown ## Support Product support is available for through following mediums. * Creating incident in Syncfusion® [Direct-trac](https://www.syncfusion.com/support/directtrac/incidents?utm_source=npm&utm_campaign=split-button) support system or [Community forum](https://www.syncfusion.com/forums/angular-js2?utm_source=npm&utm_campaign=split-button). * New [GitHub issue](https://github.com/syncfusion/ej2-angular-ui-components/issues/new). * Ask your query in [Stack Overflow](https://stackoverflow.com/?utm_source=npm&utm_campaign=split-button) with tag `syncfusion`, `ej2`. ## License Check the license detail [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/license?utm_source=npm&utm_campaign=split-button). ## Changelog Check the changelog [here](https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/splitbuttons/CHANGELOG.md?utm_source=npm&utm_campaign=split-button) © Copyright 2024 Syncfusion® Inc. All Rights Reserved. The Syncfusion® Essential® Studio license and copyright applies to this distribution. ``` -------------------------------- ### Syncfusion EJ2 Angular Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/navigations/README.md Provides links to source code and live demos for showcase applications built with Syncfusion EJ2 Angular components. ```text Expanse Tracker - Source: https://github.com/syncfusion/ej2-showcase-angular-expensetracker, Live Demo: https://ej2.syncfusion.com/showcase/angular/expensetracker/?utm_source=npm&utm_campaign=sidebar#/dashboard Web Mail - Source: https://github.com/syncfusion/ej2-showcase-angular-webmail, Live Demo: https://ej2.syncfusion.com/showcase/angular/webmail/?utm_source=npm&utm_campaign=sidebar ``` -------------------------------- ### Angular Block Editor - Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/blockeditor/README.md Provides a basic setup for the Angular Block Editor component. This snippet demonstrates how to import and use the BlockEditorModule in your Angular application. ```typescript import { NgModule } from '@angular/core'; import { BrowserModule } from '@angular/platform-browser'; import { BlockEditorModule } from '@syncfusion/ej2-angular-blockeditor'; import { AppComponent } from './app.component'; @NgModule({ declarations: [ AppComponent ], imports: [ BrowserModule, BlockEditorModule ], providers: [], bootstrap: [AppComponent] }) export class AppModule { } ``` -------------------------------- ### Syncfusion Angular Gantt Chart Component Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md This section covers the Syncfusion EJ2 Angular Gantt Chart component. It provides essential links for developers, including documentation for getting started, a live demo showcasing its features, the source code repository, and the npm package for installation. ```angular Gantt Chart: Documentation: https://ej2.syncfusion.com/angular/documentation/gantt/getting-started/ Live Demo: https://ej2.syncfusion.com/angular/demos/#/bootstrap5/gantt/default Source: src/gantt/src NPM: @syncfusion/ej2-angular-gantt ``` -------------------------------- ### Syncfusion EJ2 Angular UI Components - Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/schedule/README.md Highlights showcase samples for the Syncfusion EJ2 Angular UI Components, such as the Appointment Planner and Fare Calendar. It includes links to source code repositories and live demonstrations for each sample. ```text Showcase samples: Appointment Planner - Source, Live Demo Fare calendar - Live Demo ``` -------------------------------- ### Syncfusion EJ2 Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/charts/README.md Provides links to showcase samples for Syncfusion EJ2 components, including an Expense Tracker, Loan Calculator, Angular Stock Chart demo, and Fitness Tracker. Each sample includes links to its source code repository and a live demo. ```Markdown * Expense Tracker - [Source](https://github.com/syncfusion/ej2-sample-ng-expensetracker), [Live Demo](https://ej2.syncfusion.com/showcase/angular/expensetracker/#/dashboard?utm_source=npm&utm_campaign=chart) * Loan Calculator - [Source](https://github.com/syncfusion/ej2-sample-ng-loancalculator), [Live Demo](https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_campaign=chart) * [Angular Stock Chart demo](https://ej2.syncfusion.com/showcase/angular/stockchart/#/stockChart/?utm_source=npm&utm_campaign=chart) * Fitness Tracker - [Source](https://github.com/SyncfusionExamples/showcase-angular-health-tracker-dashboard-demo), [Live Demo](https://ej2.syncfusion.com/showcase/angular/fitness-tracker-app/) ``` -------------------------------- ### Create New Angular Application Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/kanban/README.md Creates a new Angular project using the Angular CLI and navigates into the project directory. ```bash ng new my-app cd my-app ``` -------------------------------- ### Syncfusion EJ2 Angular Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/treegrid/README.md Provides links to source code and live demos for various Syncfusion EJ2 Angular showcase samples, such as Expense Tracker, Loan Calculator, and Fitness Tracker. ```text Expense Tracker - Source: https://github.com/syncfusion/ej2-showcase-angular-expensetracker?utm_source=npm&utm_medium=listing&utm_campaign=angular-treegrid-npm, Live Demo: https://ej2.syncfusion.com/showcase/angular/expensetracker/#/dashboard?utm_source=npm&utm_medium=listing&utm_campaign=angular-treegrid-npm Loan Calculator - Source: https://github.com/syncfusion/ej2-sample-ng-loancalculator?utm_source=npm&utm_medium=listing&utm_campaign=angular-treegrid-npm, Live Demo: https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_medium=listing&utm_campaign=angular-treegrid-npm Fitness Tracker - Source: https://github.com/SyncfusionExamples/showcase-angular-health-tracker-dashboard-demo, Live Demo: https://ej2.syncfusion.com/showcase/angular/fitness-tracker-app/ ``` -------------------------------- ### Syncfusion Smith Chart Getting Started Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Documentation for the Syncfusion Smith Chart component for Angular. Details on how to implement and customize Smith charts for electrical engineering applications. ```angular https://ej2.syncfusion.com/angular/documentation/smithchart/getting-started/ ``` -------------------------------- ### Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/inputs/README.md Links to showcase samples for Syncfusion EJ2 Angular UI Components, including Loan Calculator and Cloud Pricing demos. ```Angular Loan Calculator - Source: https://github.com/syncfusion/ej2-showcase-angular-loancalculator, Live Demo: https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_campaign=slider Cloud Pricing - Live Demo: https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=slider#/fluent2/range-slider/azure-pricing ``` -------------------------------- ### Task Dependency Management Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/gantt/README.md Define and update dependencies between tasks using four types: Finish – Start, Start – Finish, Finish – Finish, and Start – Start. This ensures accurate project scheduling. ```angular import { Component } from '@angular/core'; import { GanttModule } from '@syncfusion/ej2-angular-gantt'; @Component({ selector: 'app-gantt', template: '', directives: [GanttModule] }) export class GanttComponent { public data = [ { ID: 1, Name: 'Project A', StartDate: new Date('2023-01-01'), Duration: 5, Progress: 30 }, { ID: 2, Name: 'Task A.1', StartDate: new Date('2023-01-02'), Duration: 3, Progress: 30, Predecessor: '1' }, { ID: 3, Name: 'Task A.2', StartDate: new Date('2023-01-05'), Duration: 4, Progress: 30, Predecessor: '2' } ]; public taskFields = { id: 'ID', name: 'Name', startDate: 'StartDate', duration: 'Duration', progress: 'Progress', dependency: 'Predecessor' }; } ``` -------------------------------- ### Syncfusion EJ2 Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/calendars/README.md Provides links to showcase sample projects built with Syncfusion EJ2 Angular components. Includes links to source code repositories and live demos for applications like Expanse Tracker, Loan Calculator, and Stock Chart. ```Markdown * Expanse Tracker - [Source](https://github.com/syncfusion/ej2-showcase-angular-expensetracker), [Live Demo](https://ej2.syncfusion.com/showcase/angular/expensetracker/#/dashboard?utm_source=npm&utm_campaign=daterangepicker) * Loan calculator - [Source](https://github.com/syncfusion/ej2-showcase-angular-loancalculator), [Live Demo](https://ej2.syncfusion.com/showcase/angular/loancalculator/?utm_source=npm&utm_campaign=datepicker) * Stock chart - [Live Demo](https://ej2.syncfusion.com/showcase/angular/stockchart/#/stockChart?utm_source=npm&utm_campaign=daterangepicker) ``` -------------------------------- ### Install EJ2 Angular Notifications Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/notifications/README.md Installs the @syncfusion/ej2-angular-notifications package and its dependencies using npm. ```sh npm install @syncfusion/ej2-angular-notifications ``` -------------------------------- ### Create New Angular Application Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/schedule/README.md Creates a new Angular application using the Angular CLI and navigates into the application directory. ```bash ng new my-app cd my-app ``` -------------------------------- ### Install DateRangePicker Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/calendars/README.md Installs the Syncfusion EJ2 Angular DateRangePicker and its dependent packages using npm. ```sh npm install @syncfusion/ej2-angular-calendars ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/treemap/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Syncfusion EJ2 Angular UI Components Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/popups/README.md Demonstrates various use-case samples and showcase projects built with Syncfusion EJ2 Angular UI Components. These samples cover different applications like Expanse Tracker, Story Estimator, Diagram Builder, IT Asset Management, Webmail, and Loan Calculator. ```typescript Expanse Tracker ([Source](https://github.com/syncfusion/ej2-showcase-ts-expensetracker), [Live Demo](https://ej2.syncfusion.com/showcase/typescript/expensetracker/#/dashboard)) Story Estimator ([Source](https://github.com/syncfusion/ej2-showcase-aspnetcore-story-estimator), [Live Demo](https://aspdotnetcore.syncfusion.com/showcase/aspnetcore/story-estimator/#/dashboard)) Diagram Builder ([Source](https://github.com/syncfusion/ej2-showcase-angular-diagrambuilder), [Live Demo](https://ej2.syncfusion.com/showcase/angular/diagrambuilder/)) IT Asset Management ([Live Demo](https://ej2.syncfusion.com/showcase/vue/assetmanagement/#/)) Webmail ([Source](https://github.com/syncfusion/ej2-showcase-ts-webmail), [Live Demo](https://ej2.syncfusion.com/showcase/typescript/webmail/#/home)) Loan Calculator ([Source](https://github.com/syncfusion/ej2-showcase-ts-loancalculator), [Live Demo](https://ej2.syncfusion.com/showcase/typescript/loancalculator/#/default)) ``` -------------------------------- ### Progress Tracker Showcase Sample Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/lineargauge/README.md Provides a link to the live demo for the Progress Tracker showcase sample, demonstrating Syncfusion EJ2 Angular components. ```text Live Demo: https://ej2.syncfusion.com/angular/demos/?utm_source=npm&utm_campaign=angular-lineargauge-npm#/material/linear-gauge/step-progress-bar ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/spreadsheet/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Syncfusion EJ2 Angular Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/notifications/README.md Provides links to the source code and live demos for showcase applications built with Syncfusion EJ2 Angular components. Currently includes 'Expense Tracker' and 'Loan Calculator'. ```text Showcase samples: Expanse Tracker - Source, Live Demo Loan Calculator - Source, Live Demo ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/maps/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Syncfusion EJ2 Showcase Samples Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/spreadsheet/README.md This section lists various showcase samples built with Syncfusion EJ2 components, providing links to both the source code repositories and live demos for each sample. ```APIDOC Showcase Samples: - Expense Tracker: - Source: https://github.com/syncfusion/ej2-showcase-angular-expensetracker - Live Demo: https://ej2.syncfusion.com/showcase/angular/expensetracker/#/dashboard - Loan Calculator: - Source: https://github.com/syncfusion/ej2-sample-ng-loancalculator - Live Demo: https://ej2.syncfusion.com/showcase/angular/loancalculator/ - Fitness Tracker: - Source: https://github.com/SyncfusionExamples/showcase-angular-health-tracker-dashboard-demo - Live Demo: https://ej2.syncfusion.com/showcase/angular/fitness-tracker-app/ ``` -------------------------------- ### Syncfusion Angular Query Builder Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides documentation and a live demo for the Syncfusion Angular Query Builder component. Includes links to the npm package and source code. ```angular https://ej2.syncfusion.com/angular/documentation/query-builder/getting-started/ ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/heatmap/README.md Installs the Angular CLI globally, which is used for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Syncfusion EJ2 Angular Context Menu Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides documentation and live demo links for the Syncfusion EJ2 Angular Context Menu component. Includes links to source code and npm package. ```angular https://www.syncfusion.com/angular-ui-components/angular-context-menu src/navigations/src/context-menu https://ej2.syncfusion.com/angular/demos/#/bootstrap5/context-menu/default https://ej2.syncfusion.com/angular/documentation/context-menu/getting-started/ ``` -------------------------------- ### Create New Angular Application Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/grids/README.md Creates a new Angular application using the Angular CLI and navigates into the application directory. ```bash ng new my-app cd my-app ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/diagrams/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Syncfusion TreeMap Package Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/treemap/README.md Installs the Syncfusion Angular TreeMap package and its peer dependencies into your Angular project. ```sh npm install @syncfusion/ej2-angular-treemap ``` -------------------------------- ### Create New Angular Application Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/filemanager/README.md Creates a new Angular project using the Angular CLI and navigates into the project directory. ```bash ng new my-app cd my-app ``` -------------------------------- ### Install MultiColumn ComboBox Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/multicolumncombobox/README.md Installs the Angular MultiColumn ComboBox component and its dependent packages using npm. ```sh npm install @syncfusion/ej2-angular-multicolumn-combobox ``` -------------------------------- ### Syncfusion Angular Badge Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides documentation and a live demo for the Syncfusion Angular Badge component. Includes links to the npm package and source code. ```angular https://ej2.syncfusion.com/angular/documentation/badge/getting-started/ ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/imageeditor/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Syncfusion EJ2 Angular Toolbar Documentation Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/README.md Provides documentation and live demo links for the Syncfusion EJ2 Angular Toolbar component. Includes links to source code and npm package. ```angular https://www.syncfusion.com/angular-ui-components/angular-toolbar src/navigations/src/toolbar https://ej2.syncfusion.com/angular/demos/#/bootstrap5/toolbar/default https://ej2.syncfusion.com/angular/documentation/toolbar/getting-started/ ``` -------------------------------- ### Install Syncfusion HeatMap Package Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/heatmap/README.md Installs the Syncfusion Angular HeatMap package and its peer dependencies into your Angular project. ```sh npm install @syncfusion/ej2-angular-heatmap ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/circulargauge/README.md Installs the Angular CLI globally, which is required for creating and managing Angular projects. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/barcodegenerator/README.md Installs the Angular CLI globally, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ``` -------------------------------- ### Install Angular CLI Source: https://github.com/syncfusion/ej2-angular-ui-components/blob/master/components/pdfviewer/README.md Installs the Angular CLI globally on your system, which is required for creating and managing Angular applications. ```bash npm install -g @angular/cli ```