Ionic Version 3 Segment Button Binding Error (example works in Ionic ver 2)

Any Help would be GREATLY Appreciated - Thanks!!!

When binding a segment button using these requirements:

  • bound by FormGroup
  • segment button values (choices) come async from database
  • segment button bound with initial value (string)

I get this error - ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked. Previous value: ‘false’. Current value: ‘true’.

I very simplified version, which throws the error, is shown below and available at

HTML *************************************

CODE *************************************

Removing the ngIf on the form will fix this problem. Your code will still break in production. You need to make any property accessed from the template public.

Thanks Rapropos, I appreciate the input!

Removing the *ngIf eliminated the error… However, any segment-button added after the page-view is still un-bindable.

To illustrate. I updated the GitHub with coffee & tea loaded before page-view and milk loaded after. The results are coffee/tea are bindable and milk is not.

Why this is important… many times I need to get segment button choices asynchronously.

There are several workarounds suggested in #6923.

1 Like