I have tried some of the resources here but never worked like this. I want to set default value to the dropdown from the component. I have tried using Ngmodel to Select element and Selected attribute to the option element but doesn't seem to work
template
<li *ngFor="let seats of quantityForView">
<select (change)="ChangeTicketQuantity($event)" id="selectQuantityChange" [(ngModel)] ="seats.seatQuantitySelected">
<option *ngFor="let ticketQuantity of seats.quantityList" [value]="ticketQuantity">
{{ticketQuantity}}
</option>
</select>
Component
export class ChangeSeatQuantity {
cartLineItems: any;
maxSeats: number;
selectedSeatQuantity: number;
quantityForView: any;
constructor(private _store: Store<any>) {
this.cartLineItems = (<any>window).bootstrap.promoBoxViewModel.currentCart.cartLineItems;
this.selectedSeatQuantity = this.cartLineItems[0].quantity;
this.maxSeats = 10;
this.SetQuantityForView();
}
SetQuantityForView()
{
this.quantityForView = this.cartLineItems.map((seatsAvailable: any) => ({
quantityList: Array(10).fill(1,1).map((x, i) => i),
selectedSeatQuantity: this.cartLineItems[0].quantity
}));
}
}
Data
this.quantityForView
[Object]
0: Object
quantityList: Array(10)
1: 1
2: 2
3: 3
4: 4
5: 5
6: 6
7: 7
8: 8
9: 9
length: 10
__proto__: Array(0)
selectedSeatQuantity: 2
__proto__: Object
length: 1
__proto__: Array(0)