Trong khung ion, làm thế nào để thiết lập nút phân đoạn ion đầu tiên ở trạng thái hoạt động theo mặc định?

Question

Trong ionic2 cách đặt ion-segment-button đầu tiên trong ion-segment để ở trong active state? Tôi đã cố gắng để làm điều đó với việc cung cấp các active class đến ion-segment-button như:

<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> 

Nhưng điều này không làm việc. Tôi muốn biến số ion-segment-button thành trạng thái không hoạt động đầu tiên và tương ứng,

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

làm trạng thái hoạt động. làm như thế nào?

Answer 1

này sẽ hữu ích: http://ionicframework.com/docs/v2/components/#segment

Ngoài ra, nếu bạn không có một giá trị cho home_tabs vào đầu so với các thành phần ion phân đoạn sẽ không biết chính xác những gì bạn muốn. Để giải quyết điều này, bạn có thể làm cho home_tabs = 'A' theo mặc định trên các nhà xây dựng nên vào nút đầu tiên sẽ luôn hoạt động

Đây là trong thành phần của bạn:

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

Đây là trong html của bạn:

<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> 

Bạn có thể thấy ngModel là vật nuôi, và các nhà xây dựng nó được thiết lập thú cưng là "con chó" vì vậy các thành phần ion phân khúc sẽ làm cho các nút có giá trị 'chó' các ion phân khúc nút hoạt động

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

Answer 2

Các cách chính xác để làm điều đó trong phiên bản hiện tại là như thế này:

Trong thành phần của bạn:

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

này sẽ thiết lập "chó" như là mặc định phân khúc hoạt động