import { Component , EventEmitter , HostListener , Input , Output , ViewEncapsulation } from '@angular/core' ; import { isPresent , isTrueProperty } from '../../util/util' ; name description usage demo see {@link /docs/components#segment Segment Component Docs} see {@link /docs/api/components/segment/Segment/ Segment API Docs} @ Component ( { selector : 'ion-segment-button' , template : '<ng-content></ng-content>' + '<div class="button-effect"></div>' , host : { 'tappable' : '' , 'class' : 'segment-button' , 'role' : 'button' , '[class.segment-button-disabled]' : '_disabled' , '[class.segment-activated]' : 'isActive' , '[attr.aria-pressed]' : 'isActive' } , encapsulation : ViewEncapsulation . None , } ) export class SegmentButton { isActive : boolean = false ; _disabled : boolean = false ; input @ Input ( ) value : string ; output @ Output ( ) ionSelect : EventEmitter < SegmentButton > = new EventEmitter < SegmentButton > ( ) ; input @ Input ( ) get disabled ( ) : boolean { return this . _disabled ; } set disabled ( val ) { this . _disabled = isTrueProperty ( val ) ; } constructor ( ) { } hidden @ HostListener ( 'click' ) onClick ( ) { console . debug ( 'SegmentButton, select' , this . value ) ; this . ionSelect . emit ( this ) ; } hidden ngOnInit ( ) { if ( ! isPresent ( this . value ) ) { console . warn ( '<ion-segment-button> requires a "value" attribute' ) ; } } }