Keyvalue pipe with ion-select

Ionic Framework
1

I was trying to use keyvalue pairs with ion-select-option.

In my .ts file I have a map<string, any>

 categoryMap: Map<string, any> = new Map();

  ngOnInit() {
    this.categoryMap["boys"] = ["Shorts", "Boxers", "Shirts", "T-shirts"];
    this.categoryMap["girls"] = ["Salwar", "Ghagra Choli", "Frocks"];
    console.log(this.categoryMap);
  }

In my app.component.html I am doing this

 <ion-select  placeholder="Category">
      <ion-select-option  [value]="c.key"
      *ngFor="let c of categoryMap | keyvalue" >
      {{ c.key }}</ion-select-option>
    </ion-select>

But I don’t see any options in the list.
Could someone guide me here if I am doing something wrong?

image
image540×811 13.7 KB

2

I figured out that the .set() method available in Map should be used to initialize the Map and it works for me.

ngOnInit() {
    this.categoryMap.set('boys', ['Shirts', 'T-Shirts'])
    this.categoryMap.set('girls', ['Kurtis', 'Lehengas'])
    console.log(this.categoryMap)
  }