I don’t know what’s wrong …
this what I want to accomplish
in segment 1 : all jobs with "status " true
in segment 2 : all jobs with “status” false (requests)
but it gives me this error , what’s the problem ?
--------- tab1.page.ts--------------------------------------
export class Tab1Page implements OnInit {
private loading: any;
public jobs = new Array<Job>();
public requests = new Array<Job>();
private jobsSubscription: Subscription;
nbr : string;
constructor(
private loadingCtrl: LoadingController,
private jobService: JobService,
private toastCtrl: ToastController,
public afa: AngularFirestore,
public afAuth: AngularFireAuth
) {
this.jobsSubscription = this.jobService.getJobs().subscribe(data => {
this.jobs = data;
});
}
ngOnInit() {
this.nbr = '1';
}
ngOnDestroy() {
this.jobsSubscription.unsubscribe();
}
async presentLoading() {
this.loading = await this.loadingCtrl.create({ message: 'Attend SVP...' });
return this.loading.present();
}
async deleteJob(id: string) {
try {
await this.jobService.deleteJob(id);
} catch (error) {
this.presentToast('Erreur lors de la tentative de suppression');
}
}
async presentToast(message: string) {
const toast = await this.toastCtrl.create({ message, duration: 2000 });
toast.present();
}
async approveJob(id: string){
this.jobService.approveJob();
}}
------------------------ tab1.page.html------------------------------------------
<div [ngSwitch]="nbr">
<ion-list *ngSwitchCase="'1'" >
<ion-item-sliding *ngFor="let job of jobs">
<ion-item button [routerLink]="['/travail', job.id]">
<ion-avatar slot="start">
<img [src]="job.picture">
</ion-avatar>
<ion-label>
{{ job.title }}
<p>{{ job.description }}</p>
<p>{{ job.createdAt | date: 'short' }}</p>
</ion-label>
</ion-item>
<!--
<ion-note color="primary" slot="end" *ngIf="product.price">{{ product.price | currency: 'BRL' }}</ion-note>
-->
<ion-item-options side="end">
<ion-item-option color="danger" (click)="deleteJob(job.id)">
<ion-icon slot="top" name="trash"></ion-icon>
Supprimer
</ion-item-option>
</ion-item-options>
</ion-item-sliding>
</ion-list>
<ion-list *ngSwitchCase="'2'">
<ion-item-sliding *ngFor="let request of requests">
<ion-item button [routerLink]="['/travail', job.id]">
<ion-avatar slot="start">
<img [src]="job.picture">
</ion-avatar>
<ion-label>
{{ job.title }}
<p>{{ job.description }}</p>
<p>{{ job.createdAt | date: 'short' }}</p>
</ion-label>
</ion-item>
<!--
<ion-note color="primary" slot="end" *ngIf="product.price">{{ product.price | currency: 'BRL' }}</ion-note>
-->
<ion-item-options side="end">
<ion-item-option color="danger" (click)="deleteJob(job.id)">
<ion-icon slot="top" name="trash"></ion-icon>
Supprimer
</ion-item-option>
<ion-item-option color="tertiary" (click)="approveJob()" expandable>
Approver
</ion-item-option>
</ion-item-options>
</ion-item-sliding>
</ion-list>
</div>
----------------------job.service.ts------------------------------------
constructor(private afs: AngularFirestore, private activatedRoute: ActivatedRoute,
) {
this.jobsCollection = this.afs.collection<Job>('Jobs',ref => ref.where("status", "==", true).orderBy("createdAt", "desc"));
}
getRequests(){
this.jobsCollection = this.afs.collection<Job>('Jobs',ref => ref.where("status", "==", false).orderBy("createdAt", "desc"));
return this.jobsCollection.snapshotChanges().pipe(
map(actions => {
return actions.map(a => {
const data = a.payload.doc.data();
const id = a.payload.doc.id;
return { id, ...data };
});
})
);
}
getJobs() {
return this.jobsCollection.snapshotChanges().pipe(
map(actions => {
return actions.map(a => {
const data = a.payload.doc.data();
const id = a.payload.doc.id;
return { id, ...data };
});
})
);
}
addJob(job: Job) {
return this.jobsCollection.add(job);
}
getJob(id: string) {
return this.jobsCollection.doc<Job>(id).valueChanges();
}
updateJob(id: string, job: Job) {
return this.jobsCollection.doc<Job>(id).update(job);
}
deleteJob(id: string) {
return this.jobsCollection.doc(id).delete();
}
approveJob(){
this.jobID = this.activatedRoute.snapshot.params['id'];
this.afs.doc(`Jobs/${this.jobID}`).update({
status : true
})
}
}