2017-01-24 21 views
3

Я разрабатываю простой угловой сайт 2, используя угловую 2 ленивую маршрутизацию. Я использую flickity ползунок реализовать ползунок на домашней странице, проблема: , когда я объявляю компонент слайдера в компоненте приложения (корень compoenent)Угловые 2 компоненты не отображаются правильно при использовании с выходом маршрутизатора

app.component

<app-topnav></app-topnav> 
<app-navbar></app-navbar> 
<app-home-slider></app-home-slider> <------- the slider component ! 
<router-outlet></router-outlet> 
<hr class="divider"> 
<app-footer></app-footer> 

ползунок визуализируется без проблем, , но когда я объявляю компонент слайдера в компоненте домашней страницы, который вызывается в маршрутизаторе-выходе с использованием ленивой загрузки, изображения там, но слайдер не работает,

дом-page.component

<app-home-slider></app-home-slider> <------- the slider component ! 
<app-plaques></app-plaques> 

app.routing.ts

import { Routes, RouterModule } from '@angular/router'; 

const routes: Routes = [ 
    { path: 'Accueil-*', loadChildren: './Pages/home-page/home-page.module#HomePageModule' }, 
    { path: 'A-propos-*', loadChildren: './Pages/about-page/about-page.module#AboutPageModule' }, 
    { path: 'Contact-*', loadChildren: './Pages/contact-page/contact-page.module#ContactPageModule' }, 
    { path: 'Maladies-*', loadChildren: './Pages/diseases-page/diseases-page.module#DiseasesPageModule' }, 
    { path: 'Pharmacie-*', loadChildren: './Pages/drugs-page/drugs-page.module#DrugsPageModule' }, 
    { path: 'Laboratoire-*', loadChildren: './Pages/laboratory-page/laboratory-page.module#LaboratoryPageModule' }, 
    { path: 'Paiements-assurances-*', loadChildren: './Pages/payments-page/payments-page.module#PaymentsPageModule' }, 
    { path: 'Formules-sante-*', loadChildren: './Pages/products-page/products-page.module#ProductsPageModule' }, 
    { path: 'Symptomes-signes-*', loadChildren: './Pages/symptomes-page/symptomes-page.module#SymptomesPageModule' }, 
    { path: 'Rendez-vous-*', loadChildren: './Pages/appointments-page/appointments-page.module#AppointmentsPageModule' }, 
    { path: 'Docteurs-*', loadChildren: './Pages/symptomes-page/symptomes-page.module#SymptomesPageModule' }, 
    { path: 'Blog-*', loadChildren: './Pages/blog-page/blog-page.module#BlogPageModule' }, 

]; 

export const AppRoutes = RouterModule.forRoot(routes); 
+1

Не могли бы вы добавить приложение app.routing.ts или подобное? –

+0

Хорошо! просто отредактирован! – Zecide

ответ

0

после прочтения flickity документ много раз, я понял это: при использовании WebPack мы должны добавить

var Flickity = require('flickity');