2017-04-13 78 views
3

我想包括primeng庫到我的項目與具有角2和總理納克工作

的package.json

"dependencies": { 
    "@angular/common": "~2.2.3", 
    "@angular/compiler": "~2.2.3", 
    "@angular/core": "~2.2.3", 
    "@angular/forms": "~2.2.3", 
    "@angular/http": "~2.2.3", 
    "@angular/platform-browser": "~2.2.3", 
    "@angular/platform-browser-dynamic": "~2.2.3", 
    "@angular/router": "~3.2.3", 
    "@types/jquery": "^2.0.34", 
    "angular2-highcharts": "^0.4.1", 
    "bootstrap": "^3.3.7", 
    "core-js": "^2.4.1", 
    "font-awesome": "^4.7.0", 
    "jquery": "^3.1.1", 
    "ng2-bootstrap": "^1.4.0", 
    "ng2-bs3-modal": "^0.10.4", 
    "ng2-popover": "0.0.12", 
    "primeng": "^2.0.4", 
    "rxjs": "5.0.0-rc.4", 
    "toastr-ng2": "^3.2.5", 
    "ts-helpers": "^1.1.1", 
    "zone.js": "^0.7.2" 
    }, 

角cli.json

"styles": [ 
      "./app/app.scss", 
      "../node_modules/primeng/resources/primeng.min.css", 
      "../node_modules/primeng/resources/themes/omega/theme.css", 
      "../node_modules/font-awesome/scss/font-awesome.scss" 
     ], 
     "scripts": [ 
      "../node_modules/jquery/jquery.min.js", 
      "../node_modules/tether/dist/js/tether.min.js", 
      "../node_modules/bootstrap/dist/js/bootstrap.min.js" 
     ], 

app.module.ts

import {SpinnerModule} from 'primeng/primeng'; 

NgModule

@NgModule({ 
    imports: [ 
    AboutModule, 
    ApiHelperModule, 
    CoreModule, 
    HomeModule, 
    PostModule, 
    StyleGuideModule, 
    ToDoModule, 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    SpinnerModule, 
    RouterModule.forRoot(CoreRoutes) 
    ], 
    declarations: [ 
    AppComponent 
    ], 
    providers: [ 
    { 
     provide: AuthHttp, 
     useFactory: getAuthHttp, 
     deps: [Http] 
    } 
    ], 
    schemas:[CUSTOM_ELEMENTS_SCHEMA], 
    bootstrap: [AppComponent] 
}) 

about.component.ts

import { Component, OnInit, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { SpinnerModule } from 'primeng/primeng'; 

@Component({ 
    selector: 'app-about', 
    templateUrl: './about.component.html' 
}) 
export class AboutComponent implements OnInit { 
    val:any; 
    constructor() { 
    this.val = 25; 

    } 

    ngOnInit() { 
    } 
} 

about.component.html

<p-spinner [(ngModel)]="val"></p-spinner> 

有一個在編譯沒有錯誤,但我的控制檯引發錯誤的

enter image description here

我認爲這樣是becos版本不匹配的,但我不能身影,匹配角2

的primeng版本列表

非常感謝您的幫助。

+0

全部刪除第一個'CUSTOM_ELEMENT_SCHEMA'然後告訴我們'AboutModule'。 – yurzui

+0

嗨..我上傳了項目文件在https://github.com/alaksandarjesus/test_angular2_primeng。它來自一個發電機板... –

回答

0

你必須包括ReactiveFormsModule

imports: [ 
    ReactiveFormsModule 

], 

更新:您沒有添加AboutComponent報關單

declarations: [ 
    AppComponent, AboutComponent 
    ] 
+0

對不起。它不工作... –

+0

@AlaksandarJesusGene檢查更新的答案 – Aravind

+0

No.I沒有幫助。我已經更新了github中的項目文件。如果你幫忙,我會學到一些東西。謝謝你的時間。 https://github.com/alaksandarjesus/test_angular2_primeng –