CODEWITHSUNDEEP
angulartypescriptionic-frameworkionic2
Ninoop p george
Ninoop p george

Reputation: 678

Ionic 2 custom pipe for getting single user data from firebase

I am using ionic 2 and firebase with angularfire2

I am having 2 nodes called messages and users in firebase. Following is the structure. 

/messages
  |-- uid1
  |    |-- message
  |    |-- uid1
  |    |-- time
  |
  |-- uid2
       |-- message
       |-- uid1
       |-- time

  /users
    |--uid1    
    |    |-- name
    |    |-- email
    |
    |--uid2
         |--name
         |--email

I have a page where i get all the details from the messages. and i only have the uid there. How can i get the propic and the name from the user with userid? I have created a pipe but my pipe doesnt return a value. but when i log it , it shows in the console. Following is the pipes file. pipes/singleuser.ts

import { Pipe, PipeTransform } from '@angular/core';
import { FirebaseListObservable,FirebaseObjectObservable, 
AngularFireDatabase } from 'angularfire2/database';
import { FirebaseApp } from 'angularfire2';
@Pipe({
  name: 'singleuser',
})
export class SingleuserPipe implements PipeTransform {
obs: FirebaseObjectObservable<any>;
constructor(private angdb: AngularFireDatabase){

}
transform(value: string, args) {

   this.obs = this.angdb.object('/users/'+value);
   this.obs.subscribe((succ) => {
     console.log(succ[args]);
     return "ss";
   });
  }
}

And here is the dashboard.html where the list is supposed to show.

<ion-list *ngFor="let data1 of ddata">
<ion-item *ngFor="let data of data1" (click)="gotosingleuser(data.$key)">
  <ion-avatar item-start>
    <img src="">
  </ion-avatar>
  <h2>Cher</h2>
  <p>Ugh. As if.</p>
  {{data.$key | singleuser:"email" }}
</ion-item>

And here is the function from the dashboard.ts where the messages are loaded and the userid is fetched .

loadmsg(uid){
this.obs = this.angdb.list("/messages");
this.obs.subscribe((data) => {
  this.ddata = Array.of(data);
  console.log(this.ddata);
});
}

In this application all the message go only to the admin. Its like a query system..

Upvotes: 1

Views: 245

Answers (1)

mohamad rabee
mohamad rabee

Reputation: 587

change in the pipe

    import 'rxjs/add/operator/map';
        ...
    transform(value: string, args) {

      this.obs = this.angdb.object('/users/'+value);
        return this.obs.map(user => {
          return user[args]
        });
      }

and in the html

{{(data.$key | singleuser:"email") | async }}

Upvotes: 2

Related Questions