2016-10-23 60 views
0

我創建了一個模塊,其中有一個指令(ObDatePickerModule)。
另外我創建了一個項目,它有ObDatePickerModule它的依賴關係(依賴於package.json)。
接下來我導入模塊A在我的項目的模塊:Angular2 - 使用3rd parety模塊的組件

import {BrowserModule} from '@angular/platform-browser'; 
import {NgModule} from '@angular/core'; 
import {FormsModule} from '@angular/forms'; 
import {ObDatePickerModule} from 'ng2-date-picker'; 

import {AppComponent} from './app.component'; 

@NgModule({ 
    declarations: [ 
    AppComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule, 
    ObDatePickerModule, 
    ], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { 
} 

下面是該項目的app.component:

import {Component} from '@angular/core'; 
import {ObDayPickerComponent} from 'ng2-date-picker'; 
import * as moment from 'moment'; 

@Component({ 
    selector: 'app-root', 
    template: '<ob-day-picker [(ngModel)]="date"></ob-day-picker>', 
    styleUrls: ['./app.component.css'], 
    entryComponents: [ObDayPickerComponent] 
}) 
export class AppComponent { 
    date = moment(); 
} 

這裏是我得到的錯誤:

main.bundle.js:66421 Unhandled Promise rejection: Template parse errors: 
'ob-day-picker' is not a known element: 
1. If 'ob-day-picker' is an Angular component, then verify that it is part of this module. 
2. If 'ob-day-picker' is a Web Component then add "CUSTOM_ELEMENTS_SCHEMA" to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<ob-day-picker [(ngModel)]="date"></ob-day-picker> 

我檢查了組件名稱確實是ob-day-picker

我也安慰日誌模塊和ObDayPickerComponent進口,似乎進口是正確的。

我錯過了什麼?

結賬模塊回購:
https://bitbucket.org/vlio20/ng2-date-picker

該項目可以在這裏找到:
https://github.com/vlio20/3rd-ng2-module

+0

我看不到名稱爲'ng2-date-picker'的包。檢查'ObDatePickerModule'是否包含'ObDayPickerComponent'的聲明。 – estus

+0

@estus,你在哪裏找它? – vlio20

+0

我希望它是,https://www.npmjs.com/package/ng2-date-picker。這個問題很可能與包裝本身有關。請提供問題中源代碼的鏈接。 – estus

回答

1

如果你想使用ObDayPickerComponent以外的ObDatePickerModule必須導出它喜歡:

@NgModule({ 
    declarations: [ 
    AppComponent, 
    ObDayPickerComponent, 
    ObCalendarComponent 
    ], 
    imports: [ 
    BrowserModule, 
    FormsModule 
    ], 
    exports: [ObDayPickerComponent], // this line 
    bootstrap: [AppComponent] 
}) 

export class ObDatePickerModule {} 
+0

現在我得到這個錯誤:'模塊導入的'意外值'ObDatePickerModule' – vlio20

+0

嘗試在'app.module.ts'文件中打印'console.log(ObDatePickerModule);''@ NgModule'的前面 – yurzui

+0

反應是:'功能ObDatePickerModule(){}'http://prntscr.com/cy0o9t – vlio20