イオン6タブスターターにおける再使用可能成分

8004 ワード
ionic angular テキストリンク
イオン6の再利用可能なコンポーネントを作成するためのいくつかの良いチュートリアルがあります.これらのチュートリアルは、提供されたCreate Reusable Progress Bar Component(空白、Simenenuなど)のいくつかで動作しているようですが、タブスターターでは失敗します.
私は私のエラーメッセージを私の仲間の開発者と共有するために新鮮なデモリポジトリを設定している間、私は奇妙な何かに気づいた.
すでに複数のタブで再利用されたコンポーネントがありました.
<app-explore-container name="Tab 1 page"></app-explore-container>
starter options of Ionic
<app-explore-container name="Tab 2 page"></app-explore-container>

そして-奇妙なことだった-それだけですべてのタブページで働いた!
…を出す私は私のイオンアプリで初期のこの例のコンポーネントを削除し、完全にそれを忘れてしまった.🤦

を調査した後、私は以下を学びました
最初に、コンポーネントのモジュールを定義する必要があります!
/* explore-container.module.ts */
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

import { IonicModule } from '@ionic/angular';

import { ExploreContainerComponent } from './explore-container.component';

@NgModule({
  imports: [ CommonModule, FormsModule, IonicModule],
  declarations: [ExploreContainerComponent],
  exports: [ExploreContainerComponent]
})
export class ExploreContainerComponentModule {}
source code of the tabs-starter
そして最後に、モジュール(コンポーネントの代わりに)をすべてのタブモジュールにインポートする必要があります.
/* tab1.module.ts */
import { IonicModule } from '@ionic/angular';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { Tab1Page } from './tab1.page';
import { ExploreContainerComponentModule } from '../explore-container/explore-container.module';

import { Tab1PageRoutingModule } from './tab1-routing.module';

@NgModule({
  imports: [
    IonicModule,
    CommonModule,
    FormsModule,
    ExploreContainerComponentModule,
    Tab1PageRoutingModule
  ],
  declarations: [Tab1Page]
})
export class Tab1PageModule {}
Source code
イオンのCLIを通してモジュールの作成が正しく行われているかどうかは全くわからない.ionic generate module explore-container/explore-container詳細については、「Stackoverflow」のようなSource codeの議論を参照してください.
コメントであなたの解決策を聞いて満足!
ビルドのネイティブSFDC統合とスラックアプリ
コピーPods