How could I do the following I have a component called ** listOptionsComponent , it is a generic component, Then create 2 components listOptions, from a parent component **AppComponent
app.component.html
<lista-opciones [type]="'menu1'"></lista-opciones>
<lista-opciones [type]="'menu2'"></lista-opciones>
To the 2 components passed a property type, Then in my ** ListOptionsComponent ** is going to call a service, to look for the data of the options from an api, according to the type that happens, until there everything well. My ** listOptions ** only collects the data and the time passes this information to another component which is only a component to visualize data
ListaOpciones.component.html
<list-detail [options]="options | async"></list-detail>
En listadetail.component.html
<ul *ngFor='let option of options'>
<li *ngIf="option.name=='logout'" (click)="logout()"></li>
<li *ngIf="option.name!='logout'"><a [routerLink]="[option.url]"></a></li>
</ul>
To the two components passed a type of property, Then in my ** ListOptionsComponent ** is going to call a service, to look up the data of the options of an api, according to the type that happens, until all is not well. My ** listOptions ** only collects the data and the time passes this information to another component that is only a component to display the data
Well I know that this is a trivial example, basically these 2 components 1 was to show the top navigation bar, and the other the authentication bar (login, register), and to reuse the components as this is the philosophy of angular2, I decided to create the generic and bring the options from an api, not only for these components but for many others, that I will implement them, but I need to solve this question, then try to implement redux, and basically the problem is the same, at the end As the storage is stored in listOptions, this causes the 2 x instances that implement it to change.
Aucun commentaire:
Enregistrer un commentaire