Load component with data dependant on form submission

Question

I have an application where the user fills in a form.

Currently, when the user submits the form, a GET request is sent to the server. The server responds with all the data that matches the user's form criteria. A new component is then loaded.

Code

this.formService.getMyData()
        .subscribe(
            data => {
                this.router.navigateByUrl('/showMyData');
            }
        );

I'm not doing anything with the data received. I need a way to pass the data to the new component. Does anyone know how that is done?

Example of what I'm looking for

I fill in a form with the fields 'location' and 'name'.
I submit the form.
New component is loaded with a list of all the people who match the location and name I entered previously.

Thanks.

There are a number of ways you can do this. 1. Router Params 2. Shared Service 3. @Inputs with child component — domfx, Jan 26 '17 at 15:30
Like domfx stated... and check this one out: https://angular.io/docs/ts/latest/cookbook/component-communication.html :) — AT82, Jan 26 '17 at 15:32

score 0 · Accepted Answer · edited May 23 '17 at 11:54

0

check this post Angular2 using @Inputs with <router-outlet>s

Also consider just passing the needed parameters from your parent component to your child component through router data and doing the call this.formService.getMyData() in the child component since that's the one who needs it

edited May 23 '17 at 11:54

Community

1
1

answered Jan 26 '17 at 15:28

S. Robijns

1,529
3
14
17

Load component with data dependant on form submission

1 Answers1