Essential JS 2 FileManager Component for Angular
npm install @syncfusion/ej2-angular-filemanagerThe Angular FileManager component is a graphical user interface that allows users to manage their file system in an intuitive and efficient manner. With this component, you can easily access, edit, upload, download, and organize files and folders. It also offers a convenient way to browse and select items from the file system.
Getting Started .
Online demos .
Learn more

Trusted by the world's leading companies

You can use Angular CLI to setup your Angular applications. To install Angular CLI use the following command.
``bash`
npm install -g @angular/cli
Create a new Angular application using below Angular CLI command.
`bash`
ng new my-app
cd my-app
All Syncfusion Angular packages are published in npmjs.com registry. To install Angular FileManager package, use the following command.
`bash`
ng add @syncfusion/ej2-angular-filemanager
The above command does the below configuration to your Angular app.
* Adds @syncfusion/ej2-angular-filemanager package and its peer dependencies to your package.json file.FileManagerModule
* Import the in your application module app.module.ts.angular.json
* Register the Syncfusion UI Default theme in the file.
This makes it easy to add the Syncfusion Angular FileManager module to your project and start using it in your application.
In src/app/app.component.ts, use selector in template attribute of @Component directive to render the Syncfusion Angular FileManager component.
Add the FileManager component snippet in app.component.html as follows.
`html`
Refer the FileManager component snippet in app.component.ts as follows.
`typescript``
import { Component } from '@angular/core';
@Component({
selector: 'app-root',
styleUrls: ['app/app.component.css'],
templateUrl: 'app/app.component.html'
})
export class AppComponent {
public hostUrl: string = 'https://ej2-aspcore-service.azurewebsites.net/';
public ajaxSettings: object = {
url: this.hostUrl + 'api/FileManager/FileOperations'
};
}
The FileManager component is also offered in following list of frameworks,
|
JavaScript |
React |
Vue |
ASP.NET Core |
ASP.NET MVC |
| :-----: | :-----: | :-----: | :-----: | :-----: |
* Expense Tracker - Source, Live Demo
* Loan Calculator - Source, Live Demo
* Theme Studio
* What's New
* Road Map
* E-Books
Product support is available through following mediums.
* Support ticket - Guaranteed Response in 24 hours | Unlimited tickets | Holiday support
* Community forum
* GitHub issues
* Request feature or report bug
* Live chat
Check the changelog here. Get minor improvements and bug fixes every week to stay up to date with frequent updates.
> This is a commercial product and requires a paid license for possession or use. Syncfusion® licensed software, including this component, is subject to the terms and conditions of Syncfusion® EULA. To acquire a license for 140+ Angular UI components, you can purchase or start a free 30-day trial.
> A free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.
See LICENSE FILE for more info.
© Copyright 2026 Syncfusion® Inc. All Rights Reserved. The Syncfusion® Essential Studio® license and copyright applies to this distribution.