В ионном каркасе, как по умолчанию установить первую кнопку ионного сегмента в активном состоянии?

Question

В ionic2 как установить первый ion-segment-button в ion-segment быть в active state? Я пытался сделать это с обеспечением active class к ion-segment-button как:

<div padding> 
    <ion-segment [(ngModel)]="home_tabs"> 
     <ion-segment-button class="segment-button segment-activated" value="A">A 
     </ion-segment-button> 
     <ion-segment-button value="B">B 
     </ion-segment-button> 
    </ion-segment> 
</div> 

Но это не сработало. Я хочу, чтобы сделать первый ion-segment-button быть неактивное состояние и соответствующее,

<ion-list *ngSwitchWhen="'A'" ></ion-list> 

быть в активном состоянии. Как это сделать?

Answer 1

Это должно быть полезно: http://ionicframework.com/docs/v2/components/#segment

Кроме того, если вы не имеете значение для home_tabs в начале, чем компонент ионно-сегмента не будет знать, что именно вы хотите. Чтобы решить эту проблему вы можете сделать home_tabs = «A» по умолчанию конструктор, поэтому первая кнопка всегда будет активным

Это в компоненте:

export class SegmentPage { 
    constructor() {  
    this.pet = "puppies"; 
} 
} 

Это в вашем HTML:

<ion-segment [(ngModel)]="pet"> 
    <ion-segment-button value="puppies"> 
     Puppies 
    </ion-segment-button> 
    <ion-segment-button value="kittens"> 
     Kittens 
    </ion-segment-button> 
    <ion-segment-button value="ducklings"> 
     Ducklings 
    </ion-segment-button> 
</ion-segment> 

Вы можете увидеть ngModel является домашним животным, и в конструкторе он устанавливает домашнее животное, чтобы быть «щенки», так что компонент ионно-сегмент будет сделать кнопку, которая имеет активный ион-сегмент кнопку значения «щенки»

https://github.com/driftyco/ionic-preview-app/tree/master/app/pages/segments/basic

Answer 2

Правильный способ сделать это в текущей версии выглядит так:

В компоненте:

export class SegmentPage { 
pet: string = "puppies"; 
    constructor() {} 
} 

Это установит «щенок» по умолчанию активного сегмента