Skip to content

bug: Ion Modal Input Signal Error #31184

@sarahmmcb

Description

@sarahmmcb

Prerequisites

Ionic Framework Version

v8.x

Current Behavior

The ion-modal component appears to be incompatible with Angular Input Signals. Specifically, when passing a value or object via componentProps, if the component loaded by the modal declares the input as an Input Signal, what is passed is not received as a signal, but as the actual passed value. This results in [value] is not a function errors when attempting to access the Input Signal in the modal (in this case, when attempting to use it in a computed signal). However, if you try to treat the declared Input Signal as a regular class property, the code won't compile because it's a signal and needs to be invoked.

This could be a repeat of this issue: #28876
However, one difference is that I came across this error when trying to use the Input Signal within a Computed Signal.

Expected Behavior

Passed componentProps should be received into a component with Input Signals as Input Signals and be able to be used in computed signals

Steps to Reproduce

  1. Create a component with an Input Signal and a Computed Signal that uses the Input Signal
  2. Create and Present an ion-modal programmatically, passing a value in the componentProps for the input in the component
  3. Call up the modal in your app

Code Reproduction URL

https://stackblitz.com/github/sarahmmcb/ionic-modal-input-bug?file=src%2Fapp%2Fmodal%2Fmodal.component.ts

Ionic Info

Ionic:

Ionic CLI : 7.2.1
Ionic Framework : @ionic/angular 8.8.8
@angular-devkit/build-angular : 20.3.26
@angular-devkit/schematics : 20.3.26
@angular/cli : 20.3.26
@ionic/angular-toolkit : 12.3.0

Capacitor:

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

Utility:

cordova-res : not installed globally
native-run : 2.0.3

System:

NodeJS : v24.10.0 (C:\Program Files\nodejs\node.exe)
npm : 11.6.1
OS : Windows 10

Additional Information

Repo link in case you have trouble with the StackBlitz: https://github.com/sarahmmcb/Ionic-Modal-Input-Bug
Apologies in advance if I'm just doing something stupid to cause this error.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions