如何使用 PrimeNg 从 angular2 将图像上传到 php 服务器？

Question

我的 app.component.ts 代码

import { Http, Response } from '@angular/http';
//import the do function to be used with the http library.
import "rxjs/add/operator/do";
import {FileUploadModule} from 'primeng/primeng';
//import the map function to be used with the http library
import "rxjs/add/operator/map";
import {AccordionModule} from 'primeng/primeng';      
import {MenuItem} from 'primeng/primeng';            //api
@Component({
  selector: 'my-app',
  template:  '<p-fileUpload name="myfile[]" url="./upload.php"> </p-fileUpload>'  ,
})
export class AppComponent   {
 name = 'Angular';
}

---

我的 app.module.ts 代码

import { NgModule }      from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { HttpModule } from '@angular/http' 
import { AppComponent }  from './app.component'; 
import { FormSubmitionComponent } from "./components/form.component"; 
import {FormsModule} from "@angular/forms" 
import {AccordionModule} from 'primeng/primeng';      
import {MenuItem,FileUploadModule} from 'primeng/primeng';            
@NgModule({<br>
  imports:      [ BrowserModule,FormsModule ,HttpModule,FileUploadModule], 
  declarations: [ AppComponent ,FormSubmitionComponent], 
  bootstrap:    [ AppComponent ] 
})
export class AppModule { }

---

代码来自 https://www.primefaces.org/primeng/#/fileupload 当我运行它显示

: XHR error (404 Not Found) loading http://localhost:3006/primeng/primeng
<br> 
    Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:3006/primeng/primeng
    Error: XHR error (404 Not Found) loading http://localhost:3006/primeng/primeng
        at XMLHttpRequest.wrapFn [as __zone_symbol___onreadystatechange] (http://localhost:3006/node_modules/zone.js/dist/zone.js:1056:39)
        at ZoneDelegate.invokeTask (http://localhost:3006/node_modules/zone.js/dist/zone.js:424:31)
        at Zone.runTask (http://localhost:3006/node_modules/zone.js/dist/zone.js:191:47)
        at XMLHttpRequest.ZoneTask.invoke (http://localhost:3006/node_modules/zone.js/dist/zone.js:486:38)
    Error loading http://localhost:3006/primeng/primeng as "primeng/primeng" from http://localhost:3006/app/app.module.js
        at XMLHttpRequest.wrapFn [as __zone_symbol___onreadystatechange] (http://localhost:3006/node_modules/zone.js/dist/zone.js:1056:39)
        at ZoneDelegate.invokeTask (http://localhost:3006/node_modules/zone.js/dist/zone.js:424:31)
        at Zone.runTask (http://localhost:3006/node_modules/zone.js/dist/zone.js:191:47)
        at XMLHttpRequest.ZoneTask.invoke (http://localhost:3006/node_modules/zone.js/dist/zone.js:486:38)
    Error loading http://localhost:3006/primeng/primeng as "primeng/primeng" from http://localhost:3006/app/app.module.js

Answer 1

你也需要更新你的模块：

import {FileUploadModule} from 'primeng/primeng';

@Module({
    // ...
    imports: [FileUploadModule]
})