0

I am a little new to Angular with components, so pardon the newbie question.

Here is my scenario:

  • I have a component (home) that asks the user for an address
  • When the user enters the address I want to redirect them to a new component (map) where the address is displayed on a map using google maps.
  • The data that needs to be passed to the map component is a Google maps generated json object
  • I am navigating from the home component to the map component using the navigate method of $router, which I have injected into the home component via bindings.

My question is: how do I pass the data from the home component to the map component? I tried using ngLink, but the object is so large that it gets truncated in the url.

I know I can store the data globally and then retrieve it when I init the map component, but I was wondering if there is a better way of doing this with components?

Thank you

dpdragnev
  • 2,011
  • 2
  • 28
  • 55
  • *The data that needs to be passed to the map component is a Google maps generated json object* That's the problem, I think. Why don't you pass the address in the URL of the route displaying the map component, and have the map component generate the JSON object from that address? – JB Nizet Nov 12 '16 at 15:15
  • I thought of that, but I am using the autocomplete google offers which returns a whole object that needs to be passed to the google map object. – dpdragnev Nov 12 '16 at 15:35
  • 1
    @dpdragnev have a common controller on top of home and map component. Declare one scope obj inside common ctrl. Pass this obj to both home and map component using bindings. When user enter adress, assign the google response object to the scope obj. Since you are having routing(assuming you have SPA-page will not be refreshed) and by angularjs two way binding this assigned scope obj will be available in the map component for sure. I have implemented this scenario so it will work definitely. Let me know ur comments – Pitchiah Natarajan Nov 12 '16 at 17:02
  • Thank you @PitchiahNatarajan. I ended up using $sessionStorage to pass the object. I would definitely explore your suggestion for more complex scenarios. – dpdragnev Nov 12 '16 at 20:14

0 Answers0