Indexof() is not a function

Ionic Framework ionic-v3
1

Hi All,

I am trying to remove an item row from grid. Follwing is my code:
removeBill(bill: any){ let index = this.bills.indexOf(bill); if (index > -1){ this.bills.splice(index, 1); } }

I am getting error as indexOf is not a function… Not sure what I am missing. (HTML has the same function mention). Kindly help

2

Put a breakpoint on the offending line and see what bills is. My guess is it’s not an array for some reason, but we’d need more code to know.

3

Always initialize all object and array properties, even if it’s just to {} or []. Every day there are at least a handful of threads created here by people who didn’t bother to do that, expected they would get populated by async events in time, and in the best case scenario get consistent errors. Sometimes, it’s a race condition where it works sometimes and not others.

4

Thanks so much! You are correct. I am working on it

5

I am using Form builder… Does that have any conflict with the array/firebase?

6

Yes and no. If using it with something like local arrays, use something like that on the Class page:


   deleteItem(index) {
      this.items.splice(index, 1);
   }

item that was created like that

>  addItem(id, quantity, family) {
>   //  console.log(this.items);
>     console.log(this.itemFamily);
>     if (this.itemFamily !== undefined ) {
>        this.items.push({
>          quantity: '1',
>          family: this.itemFamily
>        })
>        this.itemFamily = undefined;
>           // console.log(this.itemFamily);
>       }
>    }

Note that a local push like that will create a local array value, in local storage of app.
7

As for your Indexof(), this is Ionic 1 code, it does not work in Ionic 2+. But you can workaround, with something like let = index on the template view.

8

mmm… Thats what… Then wht works?

9

for example this, related to what i posted above:

      <ion-list>
        <ion-item *ngFor="let item of items; let id = index">
          {{item.quantity}} {{item.family}} <button ion-button block (click)="deleteItem(id)"><ion-icon name="close"></ion-icon></button>
        </ion-item>
      </ion-list>

This is ionic 2/3 code. The index value will destroy the local value defined as id in index, once i click the deleteItem button. simple.
10 
removeBill(id: any){
      this.bills.splice(id, 1);
}

Throws an error…this.bills.splice is not a function

11 
<button ion-button color="danger" (click)="removeBill(id)"><ion-icon name="trash"></ion-icon> Delete</button>

html for button

12

Don’t try to splice it, before you know you have a return.

As for your issue, show YOUR code, i’m 100% sure you call it from another variable (or undefined one).

13

What are you talking about? Array.indexOf() was added in ES5. It is pure JavaScript, has nothing whatsoever to do with Ionic framework versions.

14

Ok @rapropos. But did you tested it inside a <ion-item or button> ?

15

I don’t see how that would make any sense, and it’s not what OP was doing. OP’s problem has nothing whatsoever to do with indexOf per se. It’s because this.bills isn’t an array at the time index.bills.indexOf() is being invoked, so index.bills has no indexOf() function in its prototype.