加载资源失败:服务器响应状态为404 (未找到) ng2-file-upload

Question

我使用Angular2-CLI 1.0.0-beta.28.3我使用ng2- file -upload上传我的TXT文件。但是，我总是收到“加载资源失败:服务器响应状态为404 (未找到)”的错误消息。现在，我非常确定我没有system-config.ts文件。所以，我不能使用我在其他网站上找到的大多数解决方案。有人知道我的代码出了什么问题吗？这是我的component.ts：

import { Component, OnInit } from '@angular/core';
import { FileUploader } from 'ng2-file-upload/ng2-file-upload';

const URL = 'http://XXx.xxx.xxx.xxx/amazonStatements/';

@Component({
  selector: 'app-arr',
  templateUrl: './arr.component.html',
  styleUrls: ['./arr.component.css']
})
export class ARRComponent {
  private data: TbArr;
  private uploader:FileUploader = new FileUploader({url: URL});

  constructor() {
  }
  ngOnInit() {
  }

}

下面是我的html文件：

<div>
  <span style="float:left;padding:3px 12px;">Upload File:</span><span class="btn btn-default btn-file">
Choose File <input type="file" ng2FileSelect [uploader]="uploader" accept="text/plain" multiple /></span>
  <button type="button" class="btn btn-primary btn-s" (click)="uploader.uploadAll()" [disabled]="!uploader.getNotUploadedItems().length">
                <span class="glyphicon glyphicon-upload"></span> Upload Now
            </button>
</div>

下面是我得到的错误消息：

​

更新我的问题:这是我的项目文件夹结构：

​

Answer 1

我最近在我的项目中实现了file-uploader，下面是我如何设置它的：

创建一个FileUploaderOptions变量，在其中设置相关属性，然后将其传递给file-uploader

import { Component, OnInit } from '@angular/core';
import { FileUploader } from 'ng2-file-upload/ng2-file-upload';

const URL = 'http://XXx.xxx.xxx.xxx/amazonStatements/';

@Component({
  selector: 'app-arr',
  templateUrl: './arr.component.html',
  styleUrls: ['./arr.component.css']
})
export class ARRComponent {
  private data: TbArr;
  private uploader:FileUploader;

  constructor() {
  }
  ngOnInit() {

      const uploaderOptions: FileUploaderOptions = {
            url: URL,
            autoUpload: false,
            isHTML5: true,
            removeAfterUpload: true,
        };

      this.uploader = new FileUploader(uploaderOptions);


  }

}