2017-10-15 12 views
1

angular-cli로 4.4.5 각도로 작동하는 ngx-bootstrap을 얻으려고합니다. 모든 지시 사항을 따랐으며 모든 피어 종속성이있는 부트 스트랩 4.0.0-beta를 설치했으며 프로젝트를 올바르게 설정했습니다.CarouselComponent ngx-boostrap 및 각도 4 앱에 대한 제공자 없음

@NgModule({ 
    imports: [ 
    BrowserModule, 
    SwingModule, 
    HttpModule, 
    AppRouterModule, 
    FormsModule, 
    MultiselectDropdownModule, 
    CarouselModule.forRoot() //tried also Ng2BootstrapModule.forRoot() 
    ], 
    declarations: [ 
    AppComponent, 
    FirstComponent, 
    MyOwnComponent, 
    YetAnotherComponent 
    ], 
    providers: [ 
    { 
     'provide': APP_INITIALIZER, 
     'useFactory': LookupService.lookupServiceFactory, 
     'deps': [LookupService], 
     'multi': true 
    }, 
    LookupService, PropertiesService, DefaultApi, CacheService], 
    bootstrap: [AppComponent], 
}) 
export class AppModule { 
    // Diagnostic only: inspect router configuration 
    constructor(router: Router) { 
    console.log('Routes: ', JSON.stringify(router.config, undefined, 2)); 
    } 
} 

그때 나는 내 사용자 지정 구성 요소 중 하나의 템플릿의 구성 요소를 사용하려고 :

<div class="carousel card-image-top no-gutters"> 
    <ul class="slides"> 
     <slide *ngFor="let image of property.ads[0].images"> 
     <li> 
     <img src="{{image}}" alt=""> 
     </li> 
     </slide> 
    </ul> 
    </div> 

내가 이것에 대한 다양한 해결책을 찾기 위해 노력했다, 나는 용기 - 소프트웨어에서 모든 github에 시도, 그러나 거기에있는 모든 해결책은 효과가 없었습니다.

로드 항상 같은 오류가 발생합니다.

PropertyViewerComponent.html:10 ERROR Error: No provider for CarouselComponent! 
    at injectionError (core.es5.js:1169) 
    at noProviderError (core.es5.js:1207) 
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._throwOrNull (core.es5.js:2649) 
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKeyDefault (core.es5.js:2688) 
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_._getByKey (core.es5.js:2620) 
    at ReflectiveInjector_.webpackJsonp.../../../core/@angular/core.es5.js.ReflectiveInjector_.get (core.es5.js:2489) 
    at resolveNgModuleDep (core.es5.js:9492) 
    at NgModuleRef_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleRef_.get (core.es5.js:10562) 
    at resolveDep (core.es5.js:11050) 
    at createClass (core.es5.js:10912) 
+1

어디에서 CarouselComponent를 주입합니까? – yurzui

+0

주입하지 않았습니다. 구성 요소 템플릿 중 하나에서 지시문을 사용합니다. –

+0

@yurzui 방금 템플릿에 대한 html을 추가했습니다. 도움이되기를 바랍니다. –

답변

1

내 태그가 잘못되었습니다. @yurzui 감사합니다. 누락 캐롤라이나 요소가 없습니다. html로이해야 할 변경 :

<carousel class="carousel card-image-top no-gutters"> 
    <ul class="slides"> 
     <slide *ngFor="let image of property.ads[0].images"> 
     <li> 
     <img src="{{image}}" alt=""> 
     </li> 
     </slide> 
    </ul> 
    </carousel> 

를 해결. 이것은 구성 요소가 누락되었을 때 HTML 코드에 올바른 태그가 있는지 확인하십시오!