Как настроить угловую оболочку 2-dropzone

Question

Я пытаюсь получить угловую оболочку-обложку от https://github.com/zefoy/ngx-dropzone-wrapper для работы, но с проблемами.

Я сделал

npm install angular2-dropzone-wrapper --save 

Это приводит в новую папку с именем angular2-dropzone-wrapper в моей node_modules папке. В моей package.json я теперь "angular2-dropzone-wrapper": "^2.0.3"

В моей app.modules.ts я добавил

import { DropzoneModule, DropzoneConfig, DropzoneConfigInterface, DropzoneDirective } from "angular2-dropzone-wrapper"; 

И добавил DropzoneModule к моему

@NgModule({ 
    imports: [ 

к моей странице компонента TS-файла я добавил

private dropZoneConfig: DropzoneConfigInterface; 

В мой конструктор добавляет (VS2015 дает мне IntelliSense):

this.dropZoneConfig.server = this.url; 
    this.dropZoneConfig.acceptedFiles = "*.xml"; 

В моей HTML странице добавить

<dropzone [config]="dropZoneConfig" [message]="'Click or drag images here to upload'"></dropzone> 

Когда я теперь загрузить страницу, я получаю эту консоль ошибки:

GET http://localhost:3000/dropzone 404 (Not Found) 
Error: Error: XHR error (404 Not Found) loading http://localhost:3000/dropzone 
    at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:3000/node_modules/zone.js/dist/zone.js:698:29) 
    at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:265:35) 
    at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:154:47) 
    at XMLHttpRequest.ZoneTask.invoke (http://localhost:3000/node_modules/zone.js/dist/zone.js:335:33) 
Error loading http://localhost:3000/dropzone as "dropzone" from http://localhost:3000/node_modules/angular2-dropzone-wrapper/dist/lib/dropzone.component.js 

Я думаю, это означает, что компонент dropzone не может быть найден или неправильно настроен. Я искал дни для рабочего примера, но не могу его найти.

Кто-нибудь знает, что происходит не так?

Редактировать Я просто сделал npm update и получил эти ошибки:

+-- reflect-metadata@0.1.10 
+-- UNMET PEER DEPENDENCY rxjs@5.0.0-beta.12 
+-- typescript@2.2.1 
`-- UNMET PEER DEPENDENCY zone.js@0.6.26 

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.0.0 (node_modules\chokidar\node_modules\fsevents): 
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.1: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) 
npm WARN angular2-dropzone-wrapper@2.0.3 requires a peer of rxjs@^5.0.0 but none was installed. 
npm WARN angular2-dropzone-wrapper@2.0.3 requires a peer of zone.js@^0.7.0 but none was installed. 

Как решить эти? Они смотрят на мою проблему. Я также сделал некоторые дополнительные изменения конфигурации и теперь я получаю эту ошибку в консоли:

Error: TypeError: ctorParameters.map is not a function 

Глядя ctorParameters.map is not a function in angular2-mdl это выглядит мне нужно что-то делать с номерами версий моих зависимостей, но я не уверен, какие.

Answer 1

Я нашел проблему. я также необходимо импортировать Dropzone И мне нужно обновить свою версию Angular2 от v2.0.0 до v2.4.8

Так мой systemjs.config.js выглядит следующим образом:

var map { 
    "dropzone": "node_modules/dropzone/dist/", 
    "angular2-dropzone-wrapper": "node_modules/angular2-dropzone-wrapper" 
}; 
var packages = { 
    "dropzone": { "main": "dropzone.js", "defaultExtension": "js" }, 
    'angular2-dropzone-wrapper': { "main": "index.js", "defaultExtension": "js" } 
} 

Мой app.modules.ts также изменяется:

import { DropzoneModule } from "angular2-dropzone-wrapper/dist/index"; 

Теперь я могу загрузить свои файлы. У меня есть больше вопросов о dropzone, но спросите их по отдельному вопросу.