In ionic framework, wie setzen Sie das erste ion-segment-Taste im aktiven Zustand standardmäßig?

In ionic2 wie die ersten ion-segment-button im ion-segment werden in active state? Ich habe versucht, es zu tun mit der Bereitstellung der active class zu den ion-segment-button wie : 

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

Aber das hat nicht geklappt. Ich will, machen die ersten ion-segment-button werden in den inaktiven Zustand und die entsprechenden, 

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

werden den aktiven Zustand. Wie Sie dies tun?

InformationsquelleAutor Dipak | 2016-02-22
  1. 37

    Sollte dies hilfreich sein: http://ionicframework.com/docs/v2/components/#segment

    Auch, wenn Sie keinen Wert für home_tabs am Anfang, als die ion-segment-Komponente wird nicht wissen, was genau Sie wollen. Um dieses Problem zu lösen Sie können home_tabs = 'A', standardmäßig auf der Konstruktor also die erste Taste immer aktiv sein

    Dies ist in der Komponente:

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

    Ist dies in deinen 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>

    Können Sie sehen, ngModel ist pet, und im Konstruktor ist es die Einstellung pet zu "Welpen", so dass die ion-segment-Komponente wird die Taste, die den Wert 'Welpen' die aktive Ionen-segment-Taste

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

    • Danke, lassen Sie mich sehen Sie durch diese. 🙂
    • was ist das home_tabs und Wert? Ich kann nicht sehen, jede Konfiguration sagt home_tabs. Wo ist die Konfiguration steht in der Dokumentation Beispiel? 🙁
    • In Ihrem code, den Sie sind verbindlich ngModel einige Variablen genannt home_tabs, die es in Ihrer Komponente-Klasse. Innerhalb des Konstruktors Sie haben sollten: dies.home_tabs = 'A' also der ion-segment-Komponente erhalten Sie den Wert und die entsprechenden ion-segment-Taste aktiv. Sie nicht brauchen, um hinzuzufügen der segment-Klasse manuell aktiviert
    • Ja, das ist es, ich vermisste, dass ein Teil vollständig. Vielen, vielen Dank.
    • Sie sind willkommen 🙂
    • Der link unten nicht mehr funktioniert. Bitte update-post.
    • Auch, stellen Sie sicher,. wenn Sie zeigen, segment zur Laufzeit auf der Basis der Bedingung. dann ist es notwendig, hinzufügen, Standard-Bedingung ist true, wenn der Konstruktor aufgerufen wird.
    • Wie Sie die Zuhörer?

    InformationsquelleAutor Denko Mancheski
  2. 19

    Den richtigen Weg, es zu tun in der aktuellen version ist wie folgt:

    In der Komponente:

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

    Trägt das "Welpen" als aktives segment

    • Dies muss die akzeptierte Antwort.
    InformationsquelleAutor Philip Mannius Zudemberg
  3. 1

    Ionic-4:-
    Wir schreiben das value-Attribut des ion-segment- 

    <ion-segment (ionChange)="segmentChanged($event)" 
      value="javascript">
      <ion-segment-button value="python">
        <ion-label>Python</ion-label>
      </ion-segment-button>
      <ion-segment-button value="javascript">
        <ion-label>Javascript</ion-label>
      </ion-segment-button>
    </ion-segment>
    InformationsquelleAutor Kapil Raghuwanshi
Schreibe einen Kommentar