question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

bug: ion-segment initial state failed when using NgModel with Angular

See original GitHub issue

Bug Report

**Ionic version: [x] 5.x

Current behavior:

  1. We are using ion-segment in modal with Angular. For connivence, we use NgModel for two-way binding the checked value of ion-segment.

  2. When showing the modal for the first time, the ion-segment-button is checked when its value matches the bound variable. Screen Shot 2020-02-15 at 2 06 41 PM

  3. After closing the modal, enter again. The ion-segment-button is not checked even if its value matches the bound variable, leaving all buttons unchecked. Screen Shot 2020-02-15 at 2 07 53 PM

Expected behavior: button is checked when its value equals the bound variable.

Steps to reproduce:

  1. download code from the following link
  2. npm i
  3. ionic s

Related code: https://github.com/tuif/ionic5-segment

Ionic info:

Ionic:

   Ionic CLI                     : 6.1.0 (/usr/local/lib/node_modules/@ionic/cli)
   Ionic Framework               : @ionic/angular 5.0.0
   @angular-devkit/build-angular : 0.803.25
   @angular-devkit/schematics    : 8.3.25
   @angular/cli                  : 8.3.25
   @ionic/angular-toolkit        : 2.1.2

Cordova:

   Cordova CLI       : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms : android 8.1.0, ios 5.1.1
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 21 other plugins)

Utility:

   cordova-res : not installed
   native-run  : 0.3.0

System:

   ios-sim : 8.0.2
   NodeJS  : v12.13.0 (/usr/local/bin/node)
   npm     : 6.13.7
   OS      : macOS Mojave
   Xcode   : Xcode 11.3.1 Build version 11C504

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:11 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
dotoceancommented, Feb 19, 2020

We don’t comment on the timeline of releases, but we do hope to have 5.0.1 out soon.

Ok I’m sorry, Thanks for the fix!

0reactions
ionitron-bot[bot]commented, Mar 20, 2020

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Read more comments on GitHub >

github_iconTop Results From Across the Web

bug: ion-segment initial state failed when using NgModel with ...
Current behavior: We are using ion-segment in modal with Angular. For connivence, we use NgModel for two-way binding the checked value of ion...
Read more >
Binding to ngModel in Ionic Framework - Stack Overflow
The ngModel directive comes from the FormsModule. The error is saying that it is unable to find the directive ("unknown"), which is almost ......
Read more >
error in angular with shared module: generates "appears in ...
I have found a part of the problem. I have a component directive called TriState, showing 3 buttons. This is tristate.module.ts:
Read more >
ion-input: Custom Input Value Type Styling and CSS Properties
ion-input is a wrapper to the HTML input element, with custom value type styling and functionality. It works on desktops and integrates with...
Read more >
cannot read properties of undefined (reading 'ondestroy')
Try to remove the .angular directory! worked for me. Open side panel. Not using ngOnDestroy and getting error "Cannot read properties of undefined...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found