jeudi 13 avril 2017

Angular2 custom observer

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