Как разрешить ионный элемент, не известный в ионной - PullRequest
Новая
       52

Как разрешить ионный элемент, не известный в ионной

0 голосов
/ 07 августа 2020

Я создаю приложение с ioni c, я заметил, что когда я хочу преобразовать свое приложение в apk, элементы ioni c, такие как ion-header, ion-title, ion-list etc, перестают работать в модальном режиме. он работает на других страницах, кроме модального

вот код для comment.module.ts 

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { IonicModule } from '@ionic/angular';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import  { NgxEmojModule } from 'ngx-emoj';
import { TimeAgoPipe } from 'time-ago-pipe';

import { CommentPageRoutingModule } from './comment-routing.module';
import { CommentPage } from './comment.page';
import { PipesModule } from '../../pipes/pipes.module';

@NgModule({
  imports: [
    CommonModule,
    NgxEmojModule,
    PipesModule,
    FormsModule,
    IonicModule,
    CommentPageRoutingModule
  ],
    schemas: [CUSTOM_ELEMENTS_SCHEMA],
  declarations: [
    CommentPage,
        TimeAgoPipe]
})
export class CommentPageModule {}

Я добавил CUSTOM_ELEMENTS_SCHEMA как в модуль приложения, так и в модуль страницы, но это не просто работает.

вот страница комментариев. html

<ion-header class="ion-no-border" *ngIf="!isLoading">
    <ion-toolbar>
        <ion-title class="centerAM">{{no_comm | shortNumber}} comment{{no_comm>1?'s':''}}</ion-title>
    </ion-toolbar>
</ion-header>
<ion-content>
....

Я получаю это, когда пытаюсь преобразовать его в apk 

src/app/modal/comment/comment.page.html:1:1 - error NG8001: 'ion-header' is not a known element:
1. If 'ion-header' is an Angular component, then verify that it is part of this module.
2. If 'ion-header' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

1 <ion-header class="ion-no-border" *ngIf="!isLoading">
  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  src/app/modal/comment/comment.page.ts:7:16
    7   templateUrl: './comment.page.html',
                     ~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component CommentPage.
src/app/modal/comment/comment.page.html:2:2 - error NG8001: 'ion-toolbar' is not a known element:
1. If 'ion-toolbar' is an Angular component, then verify that it is part of this module.
2. If 'ion-toolbar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

2  <ion-toolbar>

вот код, в котором я вызвал модальный 

async CommentModal(id) {
    const modal = await this.modalController.create({
        component: CommentPage,
        componentProps:{id},
        swipeToClose: true,
        cssClass: 'comment-modal'
    });
    await modal.present();
    return 
}

вот комментарий. страница html страница 

<ion-header class="ion-no-border" *ngIf="!isLoading">
    <ion-toolbar>
        <ion-title class="centerAM">{{no_comm | shortNumber}} comment{{no_comm>1?'s':''}}</ion-title>
    </ion-toolbar>
</ion-header>
<ion-content>
    <ng-container *ngIf="isLoading; else loadTemp;">
        .....
    </ng-container>
    <ng-template #loadTemp>     
        <ion-item *ngFor="let comm of comms" lines="none">
            ....
        </ion-item>
    </ng-template>
</ion-content>
<ion-footer *ngIf="isLoggedIn">
    <ion-toolbar>
        <ng-container *ngIf="showEm">
            ....
        </ng-container>
        <ion-grid>
            <ion-row>
                .....
            </ion-row>
        </ion-grid> 
    </ion-toolbar>
</ion-footer>

Пожалуйста, что я делаю неправильно

1 Ответ

0 голосов
/ 08 августа 2020

Для загрузки модальных окон как части лениво загружаемых страниц требуется следующее:

  1. Импорт CommentPageModule в модуль лениво загружаемой модальной главной страницы

  2. Убедитесь, что CommentPage является частью объявлений и массива entryComponents для CommentPageModule

  3. Убедитесь, что нет маршрутизации, пытающейся лениво загрузить ваш CommentPageModule, поскольку модальные окна в Ioni c 4+ не загружаются лениво на свои own, они упаковываются в модуль своей страницы хостинга, который может быть загружен лениво.

Сама ошибка означает, что IonicModule недоступен для модального окна CommentPage при его создании. Это означает, что «хост» модального окна (независимо от того, какая страница инициирует модальный) в своем файле модуля, должен иметь импортированный CommentPageModule.

Пожалуйста, поделитесь файлом модуля лениво загруженной главной страницы, если вам нужна дополнительная помощь.

...