내 바닥 글 선택기가 작동하지 않습니다. Ionic

2

Ionic에서 페이지를 만들고 있는데 바닥 글에 별도의 구성 요소를 만들고 페이지에서 바닥 글 선택기를 사용하고 있지만 오류가 표시됩니다.

이것은 내 구성 요소> 발 - 카드> 발 - card.ts입니다

import { Component } from '@angular/core';

@Component({
  selector: 'foot-card',
  templateUrl: 'foot-card.html'
})
export class FootCardComponent {

  text: string;

  constructor() {
    console.log('Hello FootCardComponent Component');
    this.text = 'Hello World';
  }

}

이것은 내 components.module.ts입니다.

import { NgModule } from '@angular/core';
import { FootCardComponent } from './foot-card/foot-card';
import { IonicModule } from 'ionic-angular';

@NgModule({
    declarations: [FootCardComponent],
    imports: [IonicModule],
    exports: [FootCardComponent]
})

export class ComponentsModule {}

이것은 내 app.module.ts입니다.

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { LoginpagePage } from '../pages/loginpage/loginpage';
import { FrontPage } from './../pages/front/front';
import { FooterPage } from './../pages/footer/footer';

import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { HttpClientModule } from '@angular/common/http';
import { RestapiProvider } from '../providers/restapi/restapi';
import { FootCardComponent } from '../components/foot-card/foot-card';
import { ComponentsModule } from '../components/components.module'


@NgModule({
  declarations: [
    MyApp,
    HomePage,
    ListPage,
    LoginpagePage,
    FrontPage,
    FooterPage,
    FootCardComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    ComponentsModule,
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    ListPage,
    LoginpagePage,
    FrontPage,
    FooterPage,
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    RestapiProvider
  ]
})
export class AppModule {}

이것은 제가 제 1면에서 사용하고있는 셀렉터입니다 : (front.html)

<foot-card></foot-card>

하지만 오류를 보여줍니다. 나는 새로운 이온입니다. 어떤 도움이라도 대단히 감사합니다.

오류:

Type FootCardComponent는 ComponentsModule과 AppModule!의 두 모듈 선언에 포함되어 있습니다. FootCardComponent를 ComponentsModule 및 AppModule을 가져 오는 상위 모듈로 이동하는 것을 고려하십시오. 또한 FootCardComponent를 내보내고 포함하는 새 NgModule을 만들어 해당 NgModule을 ComponentsModule 및 AppModule로 가져올 수 있습니다.

---

• 템플릿은이 경우 footer.html입니다.이게 비어 있지 않습니까? - Jonathan
• 무엇입니까오류? - Silvermind
• 예. 내 footer.html은 비어 있지 않습니다. @홍옥 - Raghav
• 그래서 실제로 컴포넌트로 이오니아 페이지를 사용하고 싶습니다. 페이지 대신 구성 요소를 만들어야합니다.ionicframework.com/docs/cli/generate - Jonathan
• btw : 여기에 구성 요소를 만드는 데 유용한 자습서가 있습니다.joshmorony.com/build-a-custom-flash-card-component-in-ionic-2 - Jonathan

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { LoginpagePage } from '../pages/loginpage/loginpage';
import { FrontPage } from './../pages/front/front';
import { FooterPage } from './../pages/footer/footer';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { HttpClientModule } from '@angular/common/http';
import { RestapiProvider } from '../providers/restapi/restapi';
import { FootCardComponent } from '../components/foot-card/foot-card';
import { ComponentsModule } from '../components/components.module'


@NgModule({
  declarations: [
    MyApp,
    HomePage,
    ListPage,
    LoginpagePage,
    FrontPage,
    FooterPage,
    FootCardComponent **-------> *Remove this line***
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    ComponentsModule, ---------> *Add ComponentsModule in import section*
    IonicModule.forRoot(MyApp)
  ],
  bootstrap: [IonicApp],
  entryComponents: [
    MyApp,
    HomePage,
    ListPage,
    LoginpagePage,
    FrontPage,
    FooterPage,
  ],
  providers: [
    StatusBar,
    SplashScreen,
    {provide: ErrorHandler, useClass: IonicErrorHandler},
    RestapiProvider
  ]
})
export class AppModule {}