ionic-team / ionic-team/ionic-framework

feat: Allow integration of Angular custom form controls with ion-item validation behavior

Open
#21,903 7 comments 0 reactions 0 assignees View on GitHub
package: angular type: feature request
Dominant language
TypeScript
Stars
52.7k
Forks
13.3k
Avg merge
1d 15h
Merged PRs (30d)
51

Description

# Feature Request

**Ionic version:**

[x] 5.3.1

**Describe the Feature Request**

Ionic/Angular has a nice UI feature that presents validation status to users in the form of CSS classes that map to the ng form control classes. eg,` ng-valid/ng-invalid` maps to `ion-valid/ion-invalid` etc. And these classes somehow get pushed to the containing `ion-item` of the control which does the actual presentation.

We have several custom form control components and we would like to have them behave in the same manner. But there doesn't seem to be an easy way to integrate with this functionality.

Please provide a mechanism to integrate custom form controls with the ion-item valid/invalid presentation behavior.

We currently cannot implement this behavior and our forms do not function well when custom form controls are used within `ion-item` lists.

**Describe Preferred Solution**

An abstract version of Ionic's [`ValueAccessor`](https://github.com/ionic-team/ionic-framework/blob/master/angular/src/directives/control-value-accessors/value-accessor.ts) class that components could extend would be nice. This seems to be where the magic happens.

**Describe Alternatives**

Alternatively, a number of public hooks that could be called to patch the Angular functions and set the Ionic classes would also work.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.