import { AfterContentInit , ContentChildren , Directive , ElementRef , Optional , QueryList , Renderer } from '@angular/core' ; import { NgControl } from '@angular/forms' ; import { Config } from '../../config/config' ; import { BaseInput } from '../../util/base-input' ; import { assert } from '../../util/util' ; import { SegmentButton } from './segment-button' ; name description demo see {@link /docs/components#segment Segment Component Docs} see @ Directive ( { selector : 'ion-segment' , host : { '[class.segment-disabled]' : '_disabled' } } ) export class Segment extends BaseInput < string > implements AfterContentInit { hidden @ ContentChildren ( SegmentButton ) _buttons : QueryList < SegmentButton > ; constructor ( config , elementRef , renderer , @ Optional ( ) ngControl ) { super ( config , elementRef , renderer , 'segment' , null , null , null , ngControl ) ; } hidden ngAfterContentInit ( ) { this . _initialize ( ) ; this . _buttons . forEach ( button => { button . ionSelect . subscribe ( ( selectedButton ) => { this . value = selectedButton . value ; this . _fireTouched ( ) ; } ) ; } ) ; } hidden _inputUpdated ( ) { if ( ! this . _buttons ) { assert ( false , 'buttons are undefined' ) ; return ; } const buttons = this . _buttons . toArray ( ) ; const value = this . value ; for ( var button of buttons ) { button . isActive = ( button . value === value ) ; } } }