Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

bug: RadioGroup "compareWith" not available in Angular Standalone Components #29826

Closed
3 tasks done
grmpfhmbl opened this issue Sep 2, 2024 · 7 comments · Fixed by #29870
Closed
3 tasks done

bug: RadioGroup "compareWith" not available in Angular Standalone Components #29826

grmpfhmbl opened this issue Sep 2, 2024 · 7 comments · Fixed by #29870
Labels
package: angular @ionic/angular package type: bug a confirmed bug report

Comments

@grmpfhmbl
Copy link

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

When using the compareWith property of IonRadioGroup in a Ionic Angular Standalone components I get the following error:

NG8002: Can't bind to 'compareWith' since it isn't a known property of 'ion-radio-group'.

Quick look over the code it seems like it has only been forgotten to be added here:

https://github.com/ionic-team/ionic-framework/blob/7623ae4d16ac49da1f616aae7819e31b29fca59b/packages/angular/standalone/src/directives/radio-group.ts#L19C7-L19C25

To test this I quickly added the property to nodes_modules/@ionic/angular/standalone/directives/radio-group.d.ts and everything worked as expected.

Expected Behavior

The compareWith property should be available in standalone components.

Steps to Reproduce

  1. Create a standalone angular component
  2. import IonRadioGroup
  3. create a template like <ion-radio-group [(ngModel)]="foomodel" [compareWith]="compareWith">
  4. Get compiler error.

Code Reproduction URL

https://stackblitz.com/edit/angular-pe1kyd?file=src%2Fapp%2Fexample.component.html

Ionic Info

node@b085e8bce2dc:~/app/sen2cube-mobile$ ionic info
[WARN] Error loading @capacitor/ios package.json: Error: Cannot find module '@capacitor/ios/package.json'

   Require stack:
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/lib/project/index.js
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/lib/index.js
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/index.js
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/bin/ionic

[WARN] Error loading @capacitor/android package.json: Error: Cannot find module '@capacitor/android/package.json'

   Require stack:
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/lib/project/index.js
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/lib/index.js
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/index.js
   - /home/node/.npm-global/lib/node_modules/@ionic/cli/bin/ionic

Ionic:

Ionic CLI : 7.2.0 (/home/node/.npm-global/lib/node_modules/@ionic/cli)
Ionic Framework : @ionic/angular 8.0.1
@angular-devkit/build-angular : 17.3.6
@angular-devkit/schematics : 17.3.6
@angular/cli : 17.3.6
@ionic/angular-toolkit : 11.0.1

Capacitor:

Capacitor CLI : 6.0.0
@capacitor/android : not installed
@capacitor/core : 6.0.0
@capacitor/ios : not installed

Utility:

cordova-res : 0.15.4
native-run : 2.0.1

System:

NodeJS : v20.17.0 (/usr/local/bin/node)
npm : 10.8.2
OS : Linux 6.6

Additional Information

No response
@ionitron-bot ionitron-bot bot added the triage label Sep 2, 2024
@sean-perkins
Copy link
Contributor

@grmpfhmbl you are correct, the property is missing from the referenced code.

Would you be interested in submitting a PR for this?

@sean-perkins sean-perkins added package: angular @ionic/angular package type: bug a confirmed bug report labels Sep 3, 2024
@ionitron-bot ionitron-bot bot removed the triage label Sep 3, 2024
@grmpfhmbl
Copy link
Author

grmpfhmbl commented Sep 5, 2024 •
edited
Loading

Would you be interested in submitting a PR for this?

@sean-perkins Let me have a look into ionic's contribution docs over the weekend on how much overhead that would create on my end. I'll come back to you here. :-)

@ebarooni ebarooni mentioned this issue Sep 12, 2024
Merged
2 tasks
@ebarooni
Copy link
Contributor

Hey @sean-perkins , I have sent out a PR for this. I came across this issue recently and it was kinda needed for me.

@grmpfhmbl
Copy link
Author

Hey @sean-perkins , I have sent out a PR for this. I came across this issue recently and it was kinda needed for me.

Thank you! I got bogged down and forgot to submit a PR!

@ebarooni
Copy link
Contributor

Hi @sean-perkins could you please review the PR? I feel like its forgotten :)).

@sean-perkins
Copy link
Contributor

Hello @ebarooni, my review unfortunately doesn't count for much, as I'm not a CODEOWNER or a direct member of the project.

I'll try adding other members of the core team, so they can prioritize a review.

github-merge-queue bot pushed a commit that referenced this issue Oct 22, 2024
@ebarooni
fix(angular): add missing 'compareWith' input to standalone ion-radio…
47ba703 
…-group (#29870)

Issue number: resolves #29826

---------

## What is the current behavior?

When using `compareWith` on `ion-radio-group` in Ionic Angular
Standalone the following error is thrown:

```
NG8002: Can't bind to 'compareWith' since it isn't a known property of 'ion-radio-group'.
```

## What is the new behavior?

- `compareWith` on `ion-radio-group` in Angular Standalone is available

## Does this introduce a breaking change?

- [ ] Yes
- [x] No
@mathiasmuller4sh
Copy link

Hi is there a workaround before he PR is merged and released ? Thx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
package: angular @ionic/angular package type: bug a confirmed bug report
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(angular): add missing 'compareWith' input to standalone ion-radio-group ebarooni/ionic-framework
4 participants
@mathiasmuller4sh @grmpfhmbl @sean-perkins @ebarooni