Uncaught Error: Template parse errors: 'p-fileUpload' is not a known element:
Uncaught Error: Template parse errors: 'p-fileUpload' is not a known element:
sell.component.html:
<p-fileUpload #fileInput name="fileIcon"
url="rest/batch/file/multimedia/"></p-fileUpload>
上面是 fileupload 标签,我试图用它来上传带有进度条的图像。
sell.component.ts:
import { ViewChild, Component, NgModule, VERSION, OnInit } from '@angular/core';
import {BrowserModule} from '@angular/platform-browser'
import { Router } from '@angular/router';
import { MissionService } from '../app.service';
import { Configuration } from '../app.constants';
import { FormsModule } from '@angular/forms';
import { Http, Response, RequestOptions } from '@angular/http';
import { HttpClient,HttpErrorResponse,HttpHeaders,HttpRequest} from '@angular/common/http';
import { FormGroup , FormControl } from '@angular/forms';
import { HttpParams } from '@angular/common/http/src/params';
import { Headers } from '@angular/http';
import { FileUploadModule, FileUpload } from 'primeng/components/fileupload/fileupload';
declare var $: any;
declare var google: any;
@Component({
selector: 'app-sell',
templateUrl: './sell.component.html',
styleUrls: ['./sell.component.css']
})
export class SellComponent implements OnInit {}
以上是子组件的代码,我正在尝试使用 fileupload 模块。
app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { ViewChild, Component, NgModule, VERSION } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing } from './app.routing';
import { Ng2CloudinaryModule } from 'ng2-cloudinary';
import { InfiniteScrollModule } from 'angular2-infinite-scroll';
import { LazyLoadImageModule } from 'ng2-lazyload-image';
import { FileUploadModule } from 'ng2-file-upload';
import { AppComponent } from './app.component';
import { Configuration } from './app.constants';
import { MissionService } from './app.service';
import { HeaderComponent } from './header/header.component';
import { SellComponent } from './sell/sell.component';
import { UiSwitchModule } from 'ngx-ui-switch';
import { HttpClientModule } from '@angular/common/http';
//import { CookieService } from 'ngx-cookie-service';
import { FileUpload } from 'primeng/primeng';
@NgModule({
declarations: [
AppComponent,
HeaderComponent,
SellComponent,
],
imports: [
BrowserModule.withServerTransition({ appId: 'website' }),
InfiniteScrollModule,
FormsModule,
ReactiveFormsModule,
HttpModule,
routing,
Ng2CloudinaryModule,
FileUploadModule,
LazyLoadImageModule,
UiSwitchModule,HttpClientModule
],
providers: [
AuthGuard,
Configuration,
MissionService,
HomeService,
ItemService,
RegisterService,
LoginService,
SettingsService,
ChangePasswordService,
MemberProfileService,
TermsService
],
bootstrap: [AppComponent]
})
export class AppModule { }
上面的代码是主模块。即 app.module.ts 并且我添加了文件上传模块
我正在尝试在我的表单中使用带有选择、上传、取消按钮的图片上传和 primeNg 文件上传。
当我尝试在我的应用程序模块中使用标签时,它显示错误 "P-fileupload" 不是元素
将应用模块中的导入更改为:
从 'primeng/fileupload' 导入 { FileUploadModule };
在您的 app.module.ts 中,您从未完全导入 PrimeNG 文件上传。请注意 FileUploadModule 如何来自 ng2-file-upload 而不是 PrimeNG。您在顶部导入了它,但您需要将 FileUpload 添加到导入中:[ ].
sell.component.html:
<p-fileUpload #fileInput name="fileIcon"
url="rest/batch/file/multimedia/"></p-fileUpload>
sell.component.ts:
import { ViewChild, Component, NgModule, VERSION, OnInit } from '@angular/core';
import {BrowserModule} from '@angular/platform-browser'
import { Router } from '@angular/router';
import { MissionService } from '../app.service';
import { Configuration } from '../app.constants';
import { FormsModule } from '@angular/forms';
import { Http, Response, RequestOptions } from '@angular/http';
import { HttpClient,HttpErrorResponse,HttpHeaders,HttpRequest} from '@angular/common/http';
import { FormGroup , FormControl } from '@angular/forms';
import { HttpParams } from '@angular/common/http/src/params';
import { Headers } from '@angular/http';
import { FileUploadModule, FileUpload } from 'primeng/components/fileupload/fileupload';
declare var $: any;
declare var google: any;
@Component({
selector: 'app-sell',
templateUrl: './sell.component.html',
styleUrls: ['./sell.component.css']
})
export class SellComponent implements OnInit {}
以上是子组件的代码,我正在尝试使用 fileupload 模块。
app.module.ts:
import { BrowserModule } from '@angular/platform-browser';
import { ViewChild, Component, NgModule, VERSION } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { routing } from './app.routing';
import { Ng2CloudinaryModule } from 'ng2-cloudinary';
import { InfiniteScrollModule } from 'angular2-infinite-scroll';
import { LazyLoadImageModule } from 'ng2-lazyload-image';
import { FileUploadModule } from 'ng2-file-upload';
import { AppComponent } from './app.component';
import { Configuration } from './app.constants';
import { MissionService } from './app.service';
import { HeaderComponent } from './header/header.component';
import { SellComponent } from './sell/sell.component';
import { UiSwitchModule } from 'ngx-ui-switch';
import { HttpClientModule } from '@angular/common/http';
//import { CookieService } from 'ngx-cookie-service';
import { FileUpload } from 'primeng/primeng';
@NgModule({
declarations: [
AppComponent,
HeaderComponent,
SellComponent,
],
imports: [
BrowserModule.withServerTransition({ appId: 'website' }),
InfiniteScrollModule,
FormsModule,
ReactiveFormsModule,
HttpModule,
routing,
Ng2CloudinaryModule,
FileUploadModule,
LazyLoadImageModule,
UiSwitchModule,HttpClientModule
],
providers: [
AuthGuard,
Configuration,
MissionService,
HomeService,
ItemService,
RegisterService,
LoginService,
SettingsService,
ChangePasswordService,
MemberProfileService,
TermsService
],
bootstrap: [AppComponent]
})
export class AppModule { }
我正在尝试在我的表单中使用带有选择、上传、取消按钮的图片上传和 primeNg 文件上传。 当我尝试在我的应用程序模块中使用标签时,它显示错误 "P-fileupload" 不是元素
将应用模块中的导入更改为:
从 'primeng/fileupload' 导入 { FileUploadModule };
在您的 app.module.ts 中,您从未完全导入 PrimeNG 文件上传。请注意 FileUploadModule 如何来自 ng2-file-upload 而不是 PrimeNG。您在顶部导入了它,但您需要将 FileUpload 添加到导入中:[ ].