Ionic2: Question about handling inner form from the outer


#1

Good day. I have a problem with figuring out how to handle form validation with appropriate styling when there are nested forms.
The thing that I want to accomplish is the following:
I have a Page, on this page I’m showing the Tabs components with four tabs in it.
Each tab is the separate @Page. The one page that I’m currently working on has a list of some components(ItemListCmp). Each individual components(let’s call it__ItemCmp__) has a form. This form should be validated and in the case of invalid state do something with the styling of__ItemCmp__. The ItemListCmp also has a form that wraps this bunch of ItemCmp components and should also be notified somehow, when the status of the sum of all inner forms(ItemCmp) changes.
Could you help me with this, or point some source of information related to this question.
Thank you
Screen Shot 2016-03-24 at 12.20.37 PM by argeon2010, on Flickr


#2

I’m not sure if Ionic cares or not, but nested forms are not legal HTML5.


#3

:thinking: I don’t know very well Angular 2, but it can be something like Angular 1 (I hope :slight_smile: ):
You can create the watcherGroup in “Outer form” controller. This watcher will watch if the inner form’s validation is changed. BUT Angular 2 doesn’t have the watcher, does it? So you need google how you do this watcher. Maybe observer? I don’t know.


#4

For those who is interested - I’ve done it this way - http://stackoverflow.com/questions/36196946/angular2ionic2-handling-the-forms-in-inner-component-from-the-outer