Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

164
Views
El método asíncrono no funciona la primera vez

Soy nuevo en Firebase. Estoy usando la base de datos de Firestore e Ionic, tengo este problema con una llamada asíncrona y no puedo resolverlo. Básicamente en la variable item van los datos que tengo guardados en la base de datos firestore. Pero cuando quiero mostrarlos, a través de un botón, en una nueva página html sucede algo extraño, en la url aparece el parámetro pasado y desaparece inmediatamente y ya nada funciona. Tuve un problema similar en el pasado que resolví usando la tubería angular "async", pero en este caso ni siquiera funciona. En detalle, tengo una lista de elementos en un componente:

 ngOnInit() { this.itemService.getItemsList().subscribe((res)=>{ this.Tasks = res.map((t) => { return { id: t.payload.doc.id, ...t.payload.doc.data() as TODO }; }) }); }

y en item.service.ts he definido la función:

 constructor( private db: AngularFireDatabase, private ngFirestore: AngularFirestore, private router: Router ) { } getItemsList() { return this.ngFirestore.collection('items').snapshotChanges(); } getItem(id: string) { return this.ngFirestore.collection('items').doc(id).valueChanges(); }

Para cada artículo tengo un botón para mostrar el detalle:

 <ion-card *ngFor="let item of Tasks" lines="full"> .... <ion-button routerLinkActive="tab-selected" [routerLink]="['/tabs/item/',item.id]" fill="outline" slot="end">View</ion-button>

En el componente itemsDescription.ts tengo:

 ngOnInit() { this.route.params.subscribe(params => { this.id = params['id']; }); this.itemService.getItem(this.id).subscribe((data)=>{ this.item=data; }); }

Finalmente en la página html:

 <ion-card-header> <ion-card-title>{{item.id}}</ion-card-title> </ion-card-header> <ion-icon name="pin" slot="start"></ion-icon> <ion-label>{{item.Scadenza.toDate() | date:'dd/MM/yy'}}</ion-label> <ion-card-content>{{item.Descrizione}}</ion-card-content>

Se muestra la información de Scadenza y Descrizione, en cambio, no se muestra la identificación. Además, la URL debe ser pestañas/elementos/:id, pero cuando hago clic en el botón para mostrar la información del elemento, el parámetro pasado desaparece inmediatamente y solo se muestran las pestañas/elementos. Si elimino los datos en {{}}, el parámetro de la URL no desaparece

RESUELTO Seguí esta guía https://forum.ionicframework.com/t/async-data-to-child-page-with-ionic5/184197 . Entonces poner? , por ejemplo {{item?.id}} ahora todo funciona correctamente

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Su orden de código anidado no es correcto. Obtendrá el valor de la identificación después de la suscripción.

Verifique este código:

 ngOnInit() { this.route.params.subscribe(params => { this.id = params['id']; this.profileService.getItem(this.id).subscribe((data)=>{ this.item=data; }); }); }
about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!