I was in doubt if I put this question here or in the angular repository.
Suppose I have a component
ListOptionsMenu, this component receives through its input the list of options of 1 menu.
Now suppose that in a view have 4 menus, then I use ListOptionsMenu template but before I create another ListFatherOptionsMenu component to control the logic of the data.
In ListFatherOptionsMenu, I have in its constructor a menuService, this in its ngOnInit, calls to the method of the service that is in charge to bring the data of option of the menu according to the type this.menuService.getOptions (type);
Then the parent component passes to the child the options that it picked up from the service, and there is no problem in that, every 1 of the 4 menus has its corresponding options.
Now suppose I want to dynamically change the menu options, I click on a menu option that allows me to log in, the login panel opens and the 4 menus are still in the same view, just change the body, I log in and here comes the Problem, once I log in successfully, I want to change the list of options of 2 menus with a new call to the api, 1 to update the menu from login-register to logout (I know is simple), and another to update the Main menu when the user enters.
Then in ListFatherOptionsMenu could use the communication between services to link it with some observable, or use redux with ngrx / store and ngrx / effects, the problem here is that this component does not know to whom to send the data collected from the observable, and if it is sent this Is replicated in the 4 child components.
I then decided to remove this parent component and control the logic of the data from the same child components.
But the problem here is the same, if I connect an observable to a service (the one of login) to change the data (call to an api through a service), or using redux (a store), this being in the constructor, Is the same for all ListOptionsMenu, then at any change the 4 components are affected.
I thought that maybe adding a switch to the constructor and loading the appropriate store / observable according to the type of menu, could solve this problem, https://github.com/ngrx/store/issues/392 so when the user logs on, menuA, storeA is loaded, B store B and Other that do not change is not loaded any store, however this option can not be passed directly to the builder, I do not see how it knows, however I do not think a very clean option to say.
I need help to see how to control the flow of information in this type of cases, since it not only extends to many options but to any type of components that are needed as templates for other services.
I know that maybe if I create a component for MenuA, MenuB, MenuC, MenuD, this type of behavior would not cause problems, only that being of similar characteristics I do not see it necessary.
I was in doubt if I put this question here or in the angular repository.
Suppose I have a component ListOptionsMenu, this component receives through its input the list of options of 1 menu.
Now suppose that in a view have 4 menus, then I use ListOptionsMenu template but before I create another ListFatherOptionsMenu component to control the logic of the data.
In ListFatherOptionsMenu, I have in its constructor a menuService, this in its ngOnInit, calls to the method of the service that is in charge to bring the data of option of the menu according to the type this.menuService.getOptions (type); Then the parent component passes to the child the options that it picked up from the service, and there is no problem in that, every 1 of the 4 menus has its corresponding options.
Now suppose I want to dynamically change the menu options, I click on a menu option that allows me to log in, the login panel opens and the 4 menus are still in the same view, just change the body, I log in and here comes the Problem, once I log in successfully, I want to change the list of options of 2 menus with a new call to the api, 1 to update the menu from login-register to logout (I know is simple), and another to update the Main menu when the user enters.
Then in ListFatherOptionsMenu could use the communication between services to link it with some observable, or use redux with ngrx / store and ngrx / effects, the problem here is that this component does not know to whom to send the data collected from the observable, and if it is sent this Is replicated in the 4 child components.
I then decided to remove this parent component and control the logic of the data from the same child components.
But the problem here is the same, if I connect an observable to a service (the one of login) to change the data (call to an api through a service), or using redux (a store), this being in the constructor, Is the same for all ListOptionsMenu, then at any change the 4 components are affected.
I thought that maybe adding a switch to the constructor and loading the appropriate store / observable according to the type of menu, could solve this problem, https://github.com/ngrx/store/issues/392 so when the user logs on, menuA, storeA is loaded, B store B and Other that do not change is not loaded any store, however this option can not be passed directly to the builder, I do not see how it knows, however I do not think a very clean option to say.
I need help to see how to control the flow of information in this type of cases, since it not only extends to many options but to any type of components that are needed as templates for other services.
I know that maybe if I create a component for MenuA, MenuB, MenuC, MenuD, this type of behavior would not cause problems, only that being of similar characteristics I do not see it necessary.
Any kind of help, thanks in advance.