Angular2 + ng2-Uploader UPLOAD_DIRECTIVES is not defined

Am trying to use ng2-uploader in my angular2 app , i’m trying to add a button click upload action in my view , i’ve tried to do like the documentations explains


import {Component} from 'angular2/core';
import {UPLOAD_DIRECTIVES} from 'ng2-uploader/ng2-uploader';

  selector: 'demo-app',
  templateUrl: 'app/demo.html',
  directives: [UPLOAD_DIRECTIVES],
export class DemoApp {
  uploadFile: any;
  options: Object = {
    url: 'http://localhost:10050/upload'

  handleUpload(data): void {
    if (data && data.response) {
      data = JSON.parse(data.response);
      this.uploadFile = data;


<a href="load" class="clas1" 

Response: {{ uploadFile | json }}

but i’m facing this error in my navigator :

Error: ReferenceError: UPLOAD_DIRECTIVES is not
defined(…)ZoneDelegate.invoke @ @
angular2-polyfills.js:227(anonymous function) @
angular2-polyfills.js:576ZoneDelegate.invokeTask @
angular2-polyfills.js:365Zone.runTask @
angular2-polyfills.js:263drainMicroTaskQueue @
angular2-polyfills.js:482ZoneTask.invoke @ angular2-polyfills.js:434

therefore i have taken a look in the ng2-uploader component installed in the node and it looks like this :

///<reference path="../../node_modules/angular2/typings/browser.d.ts"/>
import {Ng2Uploader} from './src/services/ng2-uploader';
import {NgFileSelect} from './src/directives/ng-file-select';
import {NgFileDrop} from './src/directives/ng-file-drop';

export * from './src/services/ng2-uploader';
export * from './src/directives/ng-file-select';
export * from './src/directives/ng-file-drop';

export default {
  directives: [NgFileSelect, NgFileDrop],
  providers: [Ng2Uploader]

export const UPLOAD_DIRECTIVES: [any] = [NgFileSelect, NgFileDrop];

so it looks like everything is correct , anybody know how to repair this , , maybe i should add something to my boot.ts or my index.html , but what exactly ??

Leave a Reply

1 Comment threads
0 Thread replies
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
newest oldest most voted
Notify of

I would try the following SystemJS configuration in your main HTML file:

    map: {
      'ng2-uploader': 'node_modules/ng2-uploader'
    packages: {
      'ng2-uploader': {
        format: 'register',
        defaultExtension: 'js'