*ngFor doesn't work in modal (Angular ionic)

生来就可爱ヽ(ⅴ<●) 提交于 2021-01-01 06:35:07

问题


Im using angular in ionic application but in a modal the ngForm doesnt works. I think its cleary whit a simple code.


    <li *ngFor="let item of [1,2,3,4,5]; let i = index">
        {{i}} {{item}}
      </li>

this code show this in all rest of page ->

list

but in a modal create like this

 async presentModal(test){
    const modal = await this.modalController.create({
      component: TestPage,
      componentProps: {
          test
      }
    });
    modal.onWillDismiss().then(dataReturned => {

    });
    return await modal.present();
   }

dont show anything. Any suggest why in the modal the *ngFor o even the *ngForm doesnt work? Something im missing? Thanks.

PD: I can do every thing i want in the modal and works like write "hello" or something the modal show correctly but the ngform dont show anything.

PD2:

Also mu module.ts with all i try to import searching something to fix this...

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';

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

import { TestPageRoutingModule } from './test-routing.module';

import {ReactiveFormsModule} from '@angular/forms';
import { TestePage } from './test.page';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from 'src/app/app.component';


@NgModule({
  imports: [
    BrowserModule,
    IonicModule,
    CommonModule,
    FormsModule,
    TestPageRoutingModule,
    ReactiveFormsModule
  ],
  providers: [
    BrowserModule,
    IonicModule,
    CommonModule,
    ReactiveFormsModule,
    NavController
  ],
  declarations: [TestPage],
  bootstrap: [AppComponent]
})

回答1:


Add the component to your app.module

import { ModalComponent } from './modal/modal.component';


@NgModule({
  declarations: [ModalComponent],
  entryComponents: [ModalComponent],
  
  }),
  providers: [
  ],
  bootstrap: [AppComponent]
})

check the link below for an example

https://stackblitz.com/edit/ionic-v4-angular-modal-vxttcw?file=src%2Fapp%2Fapp.module.ts



来源:https://stackoverflow.com/questions/62367201/ngfor-doesnt-work-in-modal-angular-ionic

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!