Hi I am trying to work with ionic segments and for some reason I am not able to use a ngFor to loop through an array and display the information.
For example:
In news.html file
<div padding>
<ion-segment [(ngModel)]="segments" color="orangeColor">
<ion-segment-button value="featured">
Featured
</ion-segment-button>
<ion-segment-button value="organisations">
Charities
</ion-segment-button>
</ion-segment>
</div>
<div [ngSwitch]="segments">
<ion-list *ngSwitchCase="'organisations'">
<ion-card>
<img src="assets/imgs/saveTrees.png" />
<ion-card-content>
<ion-card-title>
Save Trees Org
</ion-card-title>
<p>
Help preserve the natural environment by growing more trees
</p>
</ion-card-content>
</ion-card>
</ion-list>
In news.ts: segments is the only code i have defined.
export class NewsPage {
segments = "featured";
featuredOrganisations = [];
and I have defined the objects within the featuredOrganisation array
Since this is static information, It is able to display this information. But when I add a *ngFor,
For instance, when I run
<ion-list *ngSwitchCase="'featured'">
<ion-list *ngFor="let organisation of featuredOrganisations">
<ion-item>
<ion-card>
<img src="{{organisation.image}}" />
<ion-card-content>
<ion-card-title>
{{organisation.title}}
</ion-card-title>
<p>
{{organisation.description}}
</p>
</ion-card-content>
</ion-card>
</ion-item>
</ion-list>
I do not get any output.
Can anyone please tell me where I am going wrong?