I try to iterate an array using the following *ngFor="let item of items"
, knowing that ngFor is used to iterate over arrays of several arrays, if I make a query that returns me for example: the subjects that a student has enrolled, knowing that the student can have 1 or many enrolled careers.
In the event that more than 1 subject is registered, there is no problem using ngFor, but if the student has only 1 degree registered, which is the case that is happening to me, ngFor generates an error that says that it can only iterate over arrays of multiple arrays.
How could I solve this problem, since this query, as I have said, returns my array in json format, but it can contain 1 or more elements.
How can I use ngFor to iterate over the array so I get 1 or more elements?
If my array comes like this the ngFor works:
[
{
"userId": 1,
"title": "medicina",
"status": 1
},
{
"userId": 1,
"title": "informatica",
"status": 1
}
]
But if it comes like this the ngFor doesn't work:
[
{
"userId": 1,
"title": "informatica",
"status": 1
}
]
And the error it shows is the following:
error trying to diff. only arrays and iterables are allowed
I show the arrangement in console and it is as follows:
This arrangement is when a student has only one career enrolled
The method that brings the data and puts it in items in my .ts file is the following
public items:any=[];
datosAcademicosUser() {
let data:Observable<any>;
data = this.http.getData(this.userDetails.id,"get/datauser");
data.subscribe( result => {
this.items = result;
}, (err) => {
console.log(err);
});
}
The html code is the following
<ion-card-content *ngFor="let item of items">
<ion-grid>
<ion-row>
<ion-col col-12>
<button ion-button full block small round color="dark">{{item.NombCar}}</button>
</ion-col>
</ion-row>
</ion-grid>
<p *ngIf="item.status==1; else inactivo" style="color:crimson;font-weight: bold;text-align: center">
Tienes inscripción activa
</p>
<ng-template #inactivo>
<p style="color:crimson;font-weight: bold;text-align: center">Inactivo</p>
</ng-template>
</ion-card-content>
The array in json format is as follows:
[
{
"id_inscripcion":"1",
"0":"1",
"estudiante_id":"1",
"1":"1",
"carrera_id":"192",
"2":"192",
"indice":"3.90",
"3":"3.90",
"status":"1",
"4":"1",
"turno":"Diurno",
"5":"Diurno",
"sede":"1",
"6":"1",
"condicion":"RG",
"7":"RG",
"uc_aprobadas":"150",
"8":"150",
"CodCar":"192",
"9":"192",
"NombCar":"INGENIERIA INFORMATICA",
"10":"INGENIERIA INFORMATICA",
"codVice":"1",
"11":"1",
"ciudad":"Barinas",
"12":"Barinas"
}
]
I am using angular 6