I have been following the concept of componentalization, and is an advocate of it, but kind of looking for a solution for a normal scenario below. It could be that my approach is wrong and must be changed, or something I am unaware of. I have been looking everywhere and trying out many things, but havent seen a success. It must be something I missed out.
I want to add a componenent with internal routing. Basically, the idea is this component can exist on any page, but uses a relative route from its parent to be in a particular state.
The requirement is that it can exist in different tabs which has states and it has to be a directive.
Can someone help me out with this concept or point me in the right direction? Would want to implement it in AngularJS 1.4
Edited
The below image depicts the scenario. Can we place the register component/directive in any tab, be it dashboard or tab2 or tab3.
We also have states in the Register component( I understand that states work in when config runs), but those are to be handled in the component code, but should stay independent of the parent route, like a standalone component.
eg: if component ABC is in page1, the route should be page1/ABC/step1 if later we decide to move it to another page, the route should be page3/ABC/step1 and this has to be done without adding the routes "page.ABC.step1" and "page.ABC.step2"
So the idea is to move around the directive without changing route configs.
I hope I have conveyed the idea properly. If you need more do let me know.