Segment
A Segment is a group of buttons, sometimes known as Segmented Controls, that allow the user to interact with a compact group of a number of controls.
Segments provide functionality similar to tabs, selecting one will unselect all others. You should use a tab bar instead of a segmented control when you want to let the user move back and forth between distinct pages in your app.
You could use Angular 2's ngModel
or FormBuilder
API. For an overview on how FormBuilder
works, checkout Angular 2 Forms, or Angular FormBuilder
Directive
selector: ion-segment
Usage
<ion-segment [(ngModel)]="relationship" (change)="onSegmentChanged($event)" danger>
<ion-segment-button value="friends">
Friends
</ion-segment-button>
<ion-segment-button value="enemies">
Enemies
</ion-segment-button>
</ion-segment>
Or with FormBuilder
<form [ngFormModel]="myForm">
<ion-segment ngControl="mapStyle" danger>
<ion-segment-button value="standard">
Standard
</ion-segment-button>
<ion-segment-button value="hybrid">
Hybrid
</ion-segment-button>
<ion-segment-button value="sat">
Satellite
</ion-segment-button>
</ion-segment>
</form>
Output Events
Attr | Details |
---|---|
change | expression to evaluate when a segment button has been changed |