AngularBeg
AngularBeg

Reputation: 33

How to show more than one property using angular2

    <select id="mySelect" [(ngModel)]="selectedItem" (ngModelChange)="onChange($event)" name="options"  class="select-project"  >            
      <optgroup label="Recent Tasks"  >
        <option *ngFor="let item of 1stList"  [ngValue]="item" ">{{item.title}}</option>
        </optgroup>
      <optgroup label="All Tasks" >
        <option *ngFor="let item of 2ndList" [ngValue]="item" >{{item.title}}</option>
      </optgroup>

Above it's my code for the select html element. My item has title,id,year,price, the desired result is to show the data from the Object like that: Id-title-price with dash between each property, problem is that I am achieving only to show only one property, not 3 of them at once. When user selects the desired option I need to take the whole information of the object.

Upvotes: 0

Views: 128

Answers (2)

Fateh Mohamed
Fateh Mohamed

Reputation: 21377

try this :

<option *ngFor="let item of 1stList"  [ngValue]="item">
 {{item.id}}-{{item.title}}-{{item.price}}
</option>

Upvotes: 0

Slappywag
Slappywag

Reputation: 1223

Unless I'm missing something you just need to add the required properties to the markup.

<option *ngFor="let item of 1stList"  [ngValue]="item">
    {{item.Id}}-{{item.title}}-{{item.price}}
</option>

Upvotes: 1

Related Questions