How to pass values created by ngFor as function parameter Ionic 3 + Angular + Firebase?

Asked

Viewed 608 times

0

it’s my first time asking on the forum so if I’m doing something wrong please correct me.

I have the following excerpt from my HTML page:

Request:

 <ion-list *ngFor = "let p of produtos | async">
      <ion-input type = "text" [disabled] = "true" value = {{p.descricao}}></ion-input>  
      <ion-input type = "text" [disabled] = "true" value = {{p.preco}}></ion-input>  
    </ion-list>

And I would like to click on the save button pass as parameter the values generated by ngFor

<div padding>
  <button ion-button type='submit' (click) = 'salvar(p.descricao, p.preco)'>
    <ion-icon name="cash"></ion-icon>Comprar</button>

But every time I click on it, it generates the following error:

ERROR TypeError: Cannot read property 'descricao' of undefined
at Object.eval [as handleEvent] (FinalizarPedidoPage.html:93)
at handleEvent (core.js:13589)
at callWithDebugContext (core.js:15098)
at Object.debugHandleEvent [as handleEvent] (core.js:14685)
at dispatchEvent (core.js:10004)
at core.js:10629
at HTMLButtonElement.<anonymous> (platform-browser.js:2628)
at t.invokeTask (polyfills.js:3)
at Object.onInvokeTask (core.js:4751)
at t.invokeTask (polyfills.js:3)

I have already noticed that the error is in passing the data as an array, because if I pass only as a single value the function is executed normally.

How can I solve this problem?

2 answers

0

For this mistake not to happen, you must declare "products" as an Array.

produtos = [];

Even if there is no index "description" it will continue the loop without errors.

0

Tries:

<ion-input type = "text" [disabled] = "true" [(ngModel)]="p.descricao"></ion-input>

Don’t forget to import Formsmodule into the module

Browser other questions tagged

You are not signed in. Login or sign up in order to post.