Hide default drop area in Angular Uploader component
27 Apr 20241 minute to read
You can achieve this behavior by override the corresponding uploader styles. In the following example, override the below styles to hide the default drop area behavior.
* .e-upload.e-control
* .e-upload .e-file-select
* .e-upload .e-file-drop
import { NgModule } from '@angular/core'
import { BrowserModule } from '@angular/platform-browser'
import { UploaderModule } from '@syncfusion/ej2-angular-inputs'
import { Component } from '@angular/core';
@Component({
imports: [
UploaderModule
],
standalone: true,
selector: 'app-root',
templateUrl: 'default.html',
styleUrls: ['./index.css']
})
export class AppComponent {
public path: Object = {
saveUrl: 'https://services.syncfusion.com/angular/production/api/FileUploader/Save',
removeUrl: 'https://services.syncfusion.com/angular/production/api/FileUploader/Remove'
};
}
import { bootstrapApplication } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import 'zone.js';
bootstrapApplication(AppComponent).catch((err) => console.error(err));
You can also explore Angular File Upload feature tour page for its groundbreaking features. You can also explore our Angular File Upload example to understand how to browse the files which you want to upload to the server.