2017-08-19 1 views
0

Utilisation de NGRX/store et firebase pour la première fois.Y at-il un bon exemple d'utilisation de NGRX avec angular-fire

le code dans le service de réservation ressemble à ceci:

reservations: FirebaseListObservable<Reservation[]> = null; 

avec une méthode de création comme ceci:

createReservation(reservation: Reservation): FirebaseListObservable<Reservation> { 
    return this.reservations.push(reservation) 
    } 

le NGRX/effet ressemble à ceci:

@Effect() 
    create$: Observable<Action> = this.actions$ 
.ofType(reservationsActions.CREATE) 
.map((action: reservationsActions.Create) => action.payload) 
.switchMap((reservation) => 
    this.reservationsService.createReservation(reservation) 
    .map((createdReservation: Reservation) => new reservationsActions.CreateSuccess(createdReservation)) 
); 

Je reçois cette erreur

Type 'ThenableReference' is not assignable to type 'FirebaseListObservable<Reservation>' 

J'ai essayé

:Observable<any> 

Je reçois ce

Property '_isScalar' is missing in type 'ThenableReference'. 

tous les trucs NGRX est correctement branché, il est seulement quand je tente de l'utiliser avec le feu angulaire que j'ai des problèmes car ce n'est pas votre CRUD typique ... GET, POST etc.

Y at-il un bon exemple d'utilisation de NGRX et angulaire-feu.

createReservation(reservation: Reservation): Observable<any> { 
return this.db.list(`${this.basePath}/${this.uid}`).push(reservation); 

}

+1

pouvez-vous décrire votre problème en détail, j'ai créé une application en utilisant ngrx v4. et juste une méthode utilisant firebase [les effets] (https://github.com/rahulrsingh09/FootBallScores/blob/master/src/app/competition/state-management/competition.effects.ts) .Plus sur [ngrx] (https://rahulrsingh09.github.io/AngularConcepts/ngrx) –

+0

J'ai une action 'createReservation' qui déclenche un effet createReservation qui switchMaps dans la méthode reservationService.createReservation (réservation) avec la réservation en tant que charge utile. Je suppose que je dois écrire les méthodes dans le service un peu différemment en utilisant NGRX et Firebase ensemble, parce que je reçois seulement ces erreurs et j'essaie d'utiliser les deux bibliothèques ensemble. –

+1

vous voudrez peut-être vérifier ce lien git je vous ai donné pour l'application de football que je construis en utilisant ngrx et angulaire, je viens d'utiliser un pagecount dans Firebase mais je suppose que cela peut être utile –

Répondre

2

je recommanderais volontiers le cours de Maximilian Schwarzmüller sur Udemy "Angular 4 (formerly Angular 2) - The Complete Guide". Ce cours épique couvre tout l'écosystème angulaire et il a publié (la semaine dernière) un «cours bonus» sur NgRx où il s'intègre à un backend Firebase, sans utiliser angularfire2.

Comme c'est généralement le cas lorsque vous posez une question à Max, le résultat a été de repenser mes propres hypothèses; pour l'instant je me suis demandé pourquoi ai-je choisi d'ajouter une dépendance comme angularfire2 dans une pile déjà poilue? Pensez-y - la promesse de NgRx (du moins telle que je la vois) est de déplacer une grande partie (espérons-le tout) de votre couche de service et de votre logique métier dans votre magasin. Dans ce paradigme, je ne suis pas sûr que angularfire2 apporte beaucoup à la fête.

J'ai eu des difficultés à incorporer angularfire2 et NgRx v4, et comme vous, je n'ai pas réussi à trouver quelqu'un qui les ait bien joué. Je pense que pour l'instant je prendrai l'avance de Max et éviterai les dépendances sur angularfire2 jusqu'à ce que j'aie un code raisonnablement complexe fonctionnant sur du HTML pur (Firebase seul) alors je peux introduire progressivement des modules angularfire2 et voir si quelque chose casse .

+0

Yea vient de voir la mise à jour du cours, j'ai hâte de creuser dedans. –