search bar dans envoyer carte ok

src/app/components/opCommercial/envoyer-carte/envoyer-carte.component.html

@@ -76,6 +76,7 @@
     <!-- Si cest un parrain existant -->
     <div *ngIf="radioParrain === 'ParrainExist'">
       <p>{{parSelect}}</p>
+      <!--
       <div class="dropdown" dropdown>
         <button dropdownToggle type="button" class="btn btn-primary dropdown-toggle waves-light" mdbRippleRadius>
           Parrains Existants
@@ -86,6 +87,18 @@
           <a class="dropdown-item" *ngFor="let par of parrainExistList | async" (click)="getIdParrain(par.uid)">{{par.firstname}} {{par.familyname}}</a>
         </div>
       </div>
+      -->
+      <input
+      #query
+      (keyup)="filter(query.value)"
+      type="text" class="form-control" placeholder="Cherchez Parrains Existants...">
+      <div *ngFor="let parrain of filteredParrainsTest">
+        <a (click)="getIdParrain(parrain.uid)">{{parrain.firstname}} {{parrain.familyname}}</a>
+        <p>
+          {{parrain?.status}}
+        </p>
+      </div>
+
 
       <div class="md-form" style="padding-top:2%;">
         <i class="fa fa-birthday-cake prefix grey-text"></i>

src/app/components/opCommercial/envoyer-carte/envoyer-carte.component.ts

@@ -16,7 +16,8 @@ import { OperationCommerciale } from '../../../../models/OperationCommerciale';
 import { CarteParrainage } from '../../../../models/CarteParrainage';
 
 import { OpCommercialService } from '../../../services/opCommercial/op-commercial.service';
-
+import { Subject } from 'rxjs/Subject';
+import { Subscription } from 'rxjs/Subscription';
 import {forEach} from '@angular/router/src/utils/collection';
 import { AuthService } from '../../../services/auth/auth.service';
 
@@ -47,6 +48,14 @@ export class EnvoyerCarteComponent implements OnInit, OnDestroy {
   parrainAffListTemp = [];
   databaseRef: any;
 
+  /////
+  parrainsTest: Parrain[];
+  filteredParrainsTest: any[];
+  subscription: Subscription;
+  //startAt = new Subject();
+  //endAt = new Subject();
+  /////
+
   constructor(public afAuth: AngularFireAuth, public afDb: AngularFireDatabase,
               private router: Router, private authService: AuthService,
               private opComService: OpCommercialService, private route: ActivatedRoute) {
@@ -148,6 +157,16 @@ export class EnvoyerCarteComponent implements OnInit, OnDestroy {
       }
     );
   }
+
+
+//////
+  filter(query: string) {
+    this.filteredParrainsTest = (query) ?
+      this.parrainsTest.filter(p => (p.firstname.toLowerCase() + p.familyname.toLowerCase()).includes(query.toLowerCase())) :
+      [];
+  }
+//////
+
   registerNewParrain() {
 
     this.parrain.status = 'Parrain';
@@ -221,11 +240,15 @@ export class EnvoyerCarteComponent implements OnInit, OnDestroy {
     this.opComService.creerCartePar(this.cartePar);
   }
 
+  //////
   ngOnInit() {
+    this.subscription = this.opComService.getParrains()
+      .subscribe(parrains => this.parrainsTest = parrains);
   }
-
+//////
 
   ngOnDestroy() {
+    this.subscription.unsubscribe();
     this.radioParrain = '';
     this.cartePar = {
       uid: '',

src/app/services/opCommercial/op-commercial.service.ts

@@ -38,6 +38,15 @@ export class OpCommercialService {
     this.storageRef = firebase.storage().ref();
   }
 
+  getParrains(): FirebaseListObservable<any> {
+    return this.afDb.list('/Parrain/', {
+        query: {
+          orderByChild: 'uid'
+        }
+      }
+    );
+  }
+
   creerCartePar(infoCartePar: CarteParrainage) {
     console.log('ba');
     infoCartePar.uid = firebase.database().ref().child('CarteParrainage').push().key;