All Components

SelectEvent

import { Component } from '@angular/core';
import { SelectEvent } from '@progress/kendo-angular-upload';

@Component({
  selector: 'my-upload',
  template: `
  <kendo-upload
    [saveUrl]="uploadSaveUrl"
    [removeUrl]="uploadRemoveUrl"
    (select)="selectEventHandler($event)">
  </kendo-upload>
  `
})
export class UploadComponent {
  uploadSaveUrl: string = "saveUrl";
  uploadRemoveUrl: string = "removeUrl";

  selectEventHandler(e: SelectEvent) {
    console.log("File selected");
  }
}
import { Component } from '@angular/core';
import { Response, ResponseOptions } from '@angular/http';
import { MockBackend } from '@angular/http/testing';

@Component({
  selector: 'my-app',
  template: `<my-upload></my-upload>`
})
export class AppComponent {
  constructor(private backend: MockBackend) {
    /*
      Mocked backend service.
      For further details check:
      https://angular.io/docs/ts/latest/api/http/testing/index/MockBackend-class.html
    */
    this.backend.connections.subscribe((c: any) => {
      let response = new Response(<ResponseOptions>{ status: 200 });

      if (c.request.url === "saveUrl") {
        c.mockDownload(response);

        setTimeout(() => {
          c.mockRespond(response);
        }, 1500);
      } else if (c.request.url === "removeUrl") {
        c.mockRespond(response);
      }
    });
  }
}
import { enableProdMode, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { Http, HttpModule, ConnectionBackend, BaseRequestOptions,
         Response, ResponseOptions, ResponseType } from '@angular/http';
import { MockBackend } from '@angular/http/testing';
import { UploadModule } from '@progress/kendo-angular-upload';
import { AppComponent }   from './app.component';
import { UploadComponent }  from './upload.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';

@NgModule({
  imports:      [ BrowserModule, HttpModule, UploadModule, BrowserAnimationsModule ],
  declarations: [ AppComponent, UploadComponent ],
  bootstrap:    [ AppComponent ],
  providers: [BaseRequestOptions, MockBackend, {
        provide: Http,
        deps: [MockBackend, BaseRequestOptions],
        useFactory: (backend, options) => {
            return new Http(backend, options);
        }
  }]
})

export class AppModule { }

enableProdMode();

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
const platform = platformBrowserDynamic();
platform.bootstrapModule(AppModule);

Fires when the user selects a file or multiple files for upload. If you cancel the event, the selection is prevented.

Arguments for the select event:

files Array<FileInfo>

The list of the selected files.

Constructors

SelectEvent (files: Array<FileInfo>)

Constructs the event arguments for the select event.

Parameters

files Array<FileInfo>

The list of the selected files.

Methods

isDefaultPrevented

If the event is prevented by any of its subscribers, returns true.

Returns

boolean true if the default action was prevented. Otherwise, returns false.

preventDefault

Prevents the default action for a specified event.
In this way, the source component suppresses the built-in behavior that follows the event.

In this article