*ngFor and *ngIf not working on ionic 4

@MengenL wrote:

I need some help here, *ngFor not working

<ion-header>
 <ion-toolbar color='primary'>
   <ion-title>Profile</ion-title>
 </ion-toolbar>
</ion-header>

<ion-content class="ion-padding">

  <ion-row class="ion-align-items-end">
    <ion-col col-2>
      <button ion-button icon-only outline (click)='transaction.expense = !transaction.expense' color="transaction.expense ? 'danger' : 'primary'">
        <ion-icon name='remove' ngIf='transaction.expense'></ion-icon>
        <ion-icon name='add' ngIf='!transaction.expense'></ion-icon>
      </button>
    </ion-col>

    <ion-col col-5>
      <ion-item>
        <ion-label floating>Value</ion-label>
        <ion-input type='number' [(ngModel)] = 'transaction.value' ></ion-input>
      </ion-item>
    </ion-col>

    <ion-col col-5>
      <ion-item>
        <ion-label floating>Month</ion-label>
        <ion-select [(ngModel)] = 'transaction.month'>
          <ion-select-option [value] = 'month.value' *ngFor ='let month of months'> {{ month.name }} </ion-select-option>
        </ion-select>
      </ion-item>
    </ion-col>
  </ion-row>

  <ion-row>
     <ion-col>
       <button ion-button full (click) = 'addTransaction()'>Add transaction</button> 

     </ion-col>
  </ion-row>

And Console says:

ERROR Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[NgIf -> TemplateRef]: 
  StaticInjectorError(Platform: core)[NgIf -> TemplateRef]: 
    NullInjectorError: No provider for TemplateRef!
NullInjectorError: StaticInjectorError(AppModule)[NgIf -> TemplateRef]: 
  StaticInjectorError(Platform: core)[NgIf -> TemplateRef]: 
    NullInjectorError: No provider for TemplateRef!
    at NullInjector.get (core.js:778)
    at resolveToken (core.js:2564)
    at tryResolveToken (core.js:2490)
    at StaticInjector.get (core.js:2353)
    at resolveToken (core.js:2564)
    at tryResolveToken (core.js:2490)
    at StaticInjector.get (core.js:2353)
    at resolveNgModuleDep (core.js:26403)
    at NgModuleRef_.get (core.js:27491)
    at resolveNgModuleDep (core.js:26403)
    at resolvePromise (zone-evergreen.js:797)
    at resolvePromise (zone-evergreen.js:754)
    at zone-evergreen.js:858
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Object.onInvokeTask (core.js:34182)
    at ZoneDelegate.invokeTask (zone-evergreen.js:390)
    at Zone.runTask (zone-evergreen.js:168)
    at drainMicroTaskQueue (zone-evergreen.js:559)
defaultErrorLogger @ core.js:9110
handleError @ core.js:9162
next @ core.js:34915
schedulerFn @ core.js:31051
__tryOrUnsub @ Subscriber.js:183
next @ Subscriber.js:122
_next @ Subscriber.js:72
next @ Subscriber.js:49
next @ Subject.js:39
emit @ core.js:31013
(anonymous) @ core.js:34240
invoke @ zone-evergreen.js:359
run @ zone-evergreen.js:124
runOutsideAngular @ core.js:34127
onHandleError @ core.js:34237
handleError @ zone-evergreen.js:363
runGuarded @ zone-evergreen.js:137
api.microtaskDrainDone @ zone-evergreen.js:663
drainMicroTaskQueue @ zone-evergreen.js:566
Promise.then (async)
scheduleMicroTask @ zone-evergreen.js:542
scheduleTask @ zone-evergreen.js:381
onScheduleTask @ zone-evergreen.js:272
scheduleTask @ zone-evergreen.js:372
scheduleTask @ zone-evergreen.js:211
scheduleMicroTask @ zone-evergreen.js:231
scheduleResolveOrReject @ zone-evergreen.js:845
resolvePromise @ zone-evergreen.js:791
(anonymous) @ zone-evergreen.js:707
webpackJsonpCallback @ bootstrap:25
(anonymous) @ profile-profile-module.js:1

Posts: 2

Participants: 2

Read full topic