How to show datas under the value in angular2/ionic2 - arrays

Question

home.ts
items = [];
constructor(public navCtrl: NavController) {
this.initializeItems();}
initializeItems() {
this.items = [
{
'title': 'Fiat',
"models" : [
{"model":"500L","value":1,"specs":"hatchback"},
{"model":"Linea","value":2,"specs":"sedan"}
]
}]
brand.html
<ion-list>
<ion-item>
<ion-label>Models</ion-label>
<ion-select id="secim" [(ngModel)]="values">
<ion-option *ngFor="let m of item.models" value="{{m.value}}">{{m.model}}</ion-option>
</ion-select>
</ion-item>
</ion-list>
<div class="" *ngIf="values==1">
<h1 *ngFor="let m of item.models">{{m.model}}:{{m.specs}}</h1>
</div>
<div class="" *ngIf="values==2" >
<h1 *ngFor="let m of item.models">{{m.model}}:{{m.specs}}</h1>
</div>
It's appear like this
500L:hatchback
Linea:sedan
but I want to do like this
(if select value=1)
500L:hatchback
(if select value=2)
Linea:sedan
How could I do? Thank you

Answer 1

Instead of what you are doing now, why not store the selected model to a variable, of which you can then show model and specs, so for example have a variable selectedModel:
<ion-item>
<ion-label>Models</ion-label>
<ion-select id="secim" [(ngModel)]="selectedModel">
<ion-option *ngFor="let m of item.models" [value]="m">{{m.model}}</ion-option>
</ion-select>
</ion-item>
And then just have one div to show the other properties:
<div *ngIf="selectedModel">{{selectedModel.model}}:{{selectedModel.specs}}</div>
DEMO: http://plnkr.co/edit/1xwhtwB5YjKHDbRzusHP?p=preview