Angular2 has the ability to create modules containing components, services, models, etc. Basically, self-contained units that are made available through an application's shared module.
In apps I've started developing, my pages are becoming a collection of components. Should the page itself be responsible for retrieving all of the data needed for the page then pass the data as properties of the components that need the data? Or, is it better to have each component be responsible for retrieving its data utilizing module approach where services used for retrieving data is part of the module? Or, use whatever approach is appropriate for the given situation?
If the right answer is use whatever approach is appropriate for the given situation, then what guidelines do you use to determine if parent page provides the data, or allow the child component to be self contained and retrieve its own data?
Thanks for your input.
Split the app into modules this helps with lazy loading and thinking about it in terms of DDD aggregate roots is a good start.
Then within a module you can have helper services to retrieve data via the Http service and you can inject them into the route components.
The route component's act as MVC controllers getting data from services, getting params from the route and generally connecting stuff together.
Then you can either have smart or dumb components.
If a component has a companion service / interacts with other stuff it's a smart component, and it thought of as impure.
Whilst a dumb component gets its input only via @Input() and only sends out event's via @Output().
Smart components are usually made up of multiple dumb components. Because dumb components are easier to test.