DanWahlin/CustomerManager

passing a url fetched from a service to a factory; factory use it to fetch additional data and pass it to a route

Closed this issue · 2 comments

Hi Dan,

Thank you for your great tutorial and video on 60-ish minutes on Angular - that was my bootstrap help in starting to learn this one-page app framework.

I worked on your customermanagerapp example (not this last release, just the simpler initial one) and I'd like to kindly ask for a briefing to you...

What I want to do is the following:

  1. a general ng-app="site" which collect a list of objects from a server (e.g. customers, the list of customers is pulled via $http )
  2. each object contains a link (like the orders of the customers, but in this case is a $http json request associated to that customer)
    3.A. By clicking on a obj link the app routes to the object-page (the customer page)
    3.B By clicking on the obj link a factory/service component of the object-page load additional data for that object, and render the graph associated with it. (the customer page displays also additional data fetched from point 2.)

At the moment, I've been (almost) able to code 3.B, thank also to the work
I say almost cause I want to call data from wikipedia, and I am able to fetch data in a factory but I failed for some reason to pass it to the directive to render the graph (return an undefined).

I have doubt in how to code 3.A.
For example, I have a service fetching data of the objets.
I have a factory fetching additional data for a selected object.
I don't know how to pass the "link" 2. both to 3.A and load the corresponding data in 3.B ...
I have a lot of confusion still...

I am posting you a sample in github:
It is based on your sample project: if you have a little time to give it a look and brief me, REAL MUCH appreciated!!

https://github.com/xdiscovery/angular-viva-route

Thank you very much!

I'm not clear on exactly where you're running into problems unfortunately. I'm happy to help as much as I possibly can but need more specific info on exactly which file you're having problems in. Looks like you're off to a great start though.

Ah ah, thank you for the encouragement :)
and thank you for your willing to help, really helpful indeed!!

I will try to be as clearer as possible.

Please locate the app of CustomerManagementApp.html

In customers.html I want to have a list of customers:
and View {{ customer.orders.length }} Orders
should route to the customer page /customerorders/#/id

I want that by clicking on the above hyperlink, /customerorders/#/id will load additional data related to that customer.
That means a $http request against an url property of a customer object.

I also want that customers.html will load customers objects with another $http request.

The scheme is (I guess):
1- customer.html fetches data of customers with customersService service, with a $http request
2- customer object contain an id and a url to a json file related to the customer
3- CustomerOrdersController get the customer ID from customersService AND pass the url to (I guess another) service: say additionalinfoFactory AND routes to the page /customerorders/#/id
4- customerOrders.html/#/id load data from additionalinfoFactory($http, customer.url) and display accordingly with a directive (additionalinfoDirective)

I am struggling with it and I am stucked.
I can't pass the customer.url from customersService to additionalinfoFactory, make additionalinfoFactory fetch the corresponding json data, pass the data to additionalinfoDirective.

Any help in doing this?
In the github link I posted I was trying to do this; in the example, additionalinfoFactory is named graphFactory and graphDirective, and then I named customers as maps, the rest the app is the same as yours.

If you could sketch out a working template with mock data, it would be great cause I would finally figure out what I have been doing wrong.
Thank you, really much!