What I am doing wrong?
html
<ion-item>
<ion-label>Select Your Star</ion-label>
<ion-select [(ngModel)]="item" (ionChange)="selectionChanged($event)" placeholder="Select One">
<ion-select-option *ngFor="let x of sets" value="{{x.setno}}">{{x.stars}}</ion-select-option>
</ion-select>
</ion-item>
<h3>{{dv}}</h3>
<h3>{{suitable}}</h3>
.ts
import { Component } from '@angular/core';
import { HttpClient } from '@angular/common/http';
@Component({
selector: 'app-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss'],
})
export class HomePage {
sets = [
{
setno: 1,
stars: 'Aswini, Makam, Moolam',
},
{
setno: 2,
stars: 'Barani, Pooram, Pooradam',
},
{
setno: 3,
stars: 'Karthigai, Uthram, Uthradam',
},
{
setno: 4,
stars: 'Rohini, Hastham, Thiruvonam',
},
{
setno: 5,
stars: 'Mirugasir, Chithrai, Avittam',
},
{
setno: 6,
stars: 'Thiruvadirai, Swathi, Sathayam',
},
{
setno: 7,
stars: 'Punarpusam, Visakam, Poorattathi',
},
{
setno: 8,
stars: 'Poosam, Anusham, Uthrattadhi',
},
{
setno: 9,
stars: 'Ayilyam, Kettai, Revathi'
}
];
// stars= [1, 2, 3, 4, 5, 6, 7, 8, 9]
// mydate = new Date(Date.now()).toISOString().split('T')[0];
constructor() {}
item = '';
dv = '';
suitable = '';
selectionChanged(ev) {
console.log('changed', ev.value);
console.log(this.item);
this.dv = this.item;
}
getSuitableStars(dv) {
switch (dv)
{
case (1):
this.suitable = '2, 4, 6, 8, 9';
break;
case(2):
this.suitable = '1, 3, 5, 7, 9';
break;
case(3):
this.suitable = '1, 2, 4, 6, 8';
break;
case(4):
this.suitable = '2, 3, 5, 7, 9';
break;
case(5):
this.suitable = '1, 3, 4, 6, 8';
break;
case(6):
this.suitable = '2, 4, 5, 7, 9';
break;
case(7):
this.suitable = '1, 3, 5, 6, 8';
break;
case(8):
this.suitable = '2, 4, 6, 7, 9';
break;
case(9):
this.suitable = '1, 3, 5, 7, 8';
break;
default:
this.suitable = 'Not applicable';
break;
}
return this.suitable;
}
}
Also I wish to give the details from the sets [ …] instead of the numbers in the case statement.
Please help.