ページでコンポーネントを使用する方法

アマウリーラローズ

いくつかのページ内にカスタムコンポーネントを追加しようとしています。

  • 私は自分のページを作成しました: ionic g pages name
  • コンポーネントを作成しました: ionic g component name

この時点で私はこれを試してみます:

<ion-content>
    <app-menu-button></app-menu-button>
</ion-content>

app-menu-buttonはコンポーネントセレクターです

このエラーが発生します: 1. If 'app-menu-button' is an Angular component, then verify that it is part of this module.

app-moduleファイルにこれを追加しようとしています:

exports: [
    MenuButtonComponent
  ]

しかし、それは機能しません。

私の目標は、このコンポーネントを複数のページに表示することです。

ありがとう、

サンティアゴバルデス

遅延読み込みを使用している場合は、カスタムコンポーネントをページモジュールにインポートする必要があります。例:AppMenuButtonComponentと呼ばれるページでコンポーネントを使用するExamplePage場合は、ページモジュールにインポートする必要があります。

import { NgModule } from '@angular/core';
import { IonicPageModule } from 'ionic-angular';
import { ExamplePage } from './example';
import { AppMenuButtonComponent } from '../../components/appmenubutton/appmenubutton';

@NgModule({
  declarations: [
    ExamplePage,
    AppMenuButtonComponent
  ],
  imports: [
    IonicPageModule.forChild(ExamplePage),

  ],
  exports: [
    ExamplePage,
  ]
})
export class ExamplePageModule {

}

カスタムコンポーネントの作成時に自動的に追加されたapp.module.tsファイルからインポートと宣言を削除することを忘れないでください。

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してください[email protected]

編集
0

コメントを追加

0

関連記事

分類Dev

ページでコンポーネントを使用する方法

分類Dev

ページでカスタムコンポーネントを使用する

分類Dev

1ページでVueコンポーネントを複数回使用する正しい方法

分類Dev

ジェネリックコンポーネントでwithRouter()を使用する方法

分類Dev

Apache FelixWebコンソールでコンポーネントページを有効にする方法

分類Dev

React:ページ内でコンポーネントを2回レンダリングする方法は?

分類Dev

同じページにコンポーネントをreactでレンダリングする方法

分類Dev

ログインページreactJSでヘッダーコンポーネントを非表示にする方法

分類Dev

Flaskを使用してReact.jsシングルページコンポーネントを提供する方法

分類Dev

特定のページにコンポーネントを表示する方法

分類Dev

joomlaコンポーネント管理者ページを構築する方法

分類Dev

vueコンポーネントjsとaxiosrouter-viewを使用してlaravelでページネーションを作成する方法

分類Dev

vueコンポーネントjsとaxiosrouter-viewを使用してlaravelでページネーションを作成する方法

分類Dev

複数ページのコンポーネントを使用するIonic4

分類Dev

テンプレートコンポーネント/ページを使用してGatsbyで動的スラッグを作成する方法はありますか?

分類Dev

コンポーネントページで最初のInstTypeを条件付きで設定する方法

分類Dev

Reactのページで同じコンポーネントを複数回使用すると、小道具が混在する

分類Dev

VueコンポーネントでsetIntervalを使用する方法

分類Dev

機能コンポーネントでgetChildContextを使用する方法

分類Dev

Reactコンポーネント内でCDNを使用する方法

分類Dev

VuejsコンポーネントでElectronAPIを使用する方法は?

分類Dev

角度コンポーネントでdebounceTimeを使用する方法は?

分類Dev

サブコンポーネントでAndroidInjectorを使用する方法

分類Dev

Webコンポーネントで子要素を使用する方法

分類Dev

子コンポーネント内でformGroupNameを使用する方法

分類Dev

WebWorkerでReactコンポーネントを使用する方法

分類Dev

JavaScriptでJSFコンポーネントを使用する方法

分類Dev

ElectronJsでStencilJsコンポーネントを使用する方法

分類Dev

Ionic2-ページコンポーネントのcssファイルをインポートする方法

Related 関連記事

  1. 1

    ページでコンポーネントを使用する方法

  2. 2

    ページでカスタムコンポーネントを使用する

  3. 3

    1ページでVueコンポーネントを複数回使用する正しい方法

  4. 4

    ジェネリックコンポーネントでwithRouter()を使用する方法

  5. 5

    Apache FelixWebコンソールでコンポーネントページを有効にする方法

  6. 6

    React:ページ内でコンポーネントを2回レンダリングする方法は?

  7. 7

    同じページにコンポーネントをreactでレンダリングする方法

  8. 8

    ログインページreactJSでヘッダーコンポーネントを非表示にする方法

  9. 9

    Flaskを使用してReact.jsシングルページコンポーネントを提供する方法

  10. 10

    特定のページにコンポーネントを表示する方法

  11. 11

    joomlaコンポーネント管理者ページを構築する方法

  12. 12

    vueコンポーネントjsとaxiosrouter-viewを使用してlaravelでページネーションを作成する方法

  13. 13

    vueコンポーネントjsとaxiosrouter-viewを使用してlaravelでページネーションを作成する方法

  14. 14

    複数ページのコンポーネントを使用するIonic4

  15. 15

    テンプレートコンポーネント/ページを使用してGatsbyで動的スラッグを作成する方法はありますか?

  16. 16

    コンポーネントページで最初のInstTypeを条件付きで設定する方法

  17. 17

    Reactのページで同じコンポーネントを複数回使用すると、小道具が混在する

  18. 18

    VueコンポーネントでsetIntervalを使用する方法

  19. 19

    機能コンポーネントでgetChildContextを使用する方法

  20. 20

    Reactコンポーネント内でCDNを使用する方法

  21. 21

    VuejsコンポーネントでElectronAPIを使用する方法は?

  22. 22

    角度コンポーネントでdebounceTimeを使用する方法は?

  23. 23

    サブコンポーネントでAndroidInjectorを使用する方法

  24. 24

    Webコンポーネントで子要素を使用する方法

  25. 25

    子コンポーネント内でformGroupNameを使用する方法

  26. 26

    WebWorkerでReactコンポーネントを使用する方法

  27. 27

    JavaScriptでJSFコンポーネントを使用する方法

  28. 28

    ElectronJsでStencilJsコンポーネントを使用する方法

  29. 29

    Ionic2-ページコンポーネントのcssファイルをインポートする方法

ホットタグ

アーカイブ