Ionic3, Typescript - Ignore Typescript Errors “property ' ' does not exist on value of type ' '”

Question

I've gone through this post (and this one as well) to find a solution to my problem.

I want to ignore these errors:

Property 'payload' does not exist on type 'Matatu'.

Property 'key' does not exist on type 'Matatu'.

I've tried declaring variables to 'override' the type system, but it hasn't worked.

Here is my .ts code, and what I've attempted so far:

import { Component } from '@angular/core';
import { IonicPage, NavController, NavParams, ActionSheetController } from 'ionic-angular';
import { AngularFireList, AngularFireDatabase } from 'angularfire2/database';
import { Matatu } from '../../models/matatu/matatu.interface';
/* imports */

declare var payload;
declare var key;

@IonicPage()
@Component({
  selector: 'page-owner-dash',
  templateUrl: 'owner-dash.html',
})
export class OwnerDashPage {

  matatuListRef$: AngularFireList<Matatu>;
  matatuListAsync$: any;

  constructor(public navCtrl: NavController, public navParams: NavParams, private database: AngularFireDatabase, public actionShtCrtl: ActionSheetController) {

    this.matatuListRef$ = this.database.list('matatu-list');
    this.matatuListAsync$ = this.matatuListRef$.snapshotChanges();

  }

  ionViewDidLoad() {
   //stuff 
  }

  selectMatatu(matatu: Matatu){
    this.actionShtCrtl.create({
      title: `${matatu.payload.val().matNumberPlate}`,
      buttons: [
        {
          text: 'Edit',
          handler: () => {
            //stuff
          }          
        },
        {
          text: 'Delete',
          role: 'destructive',
          handler: () => {
            this.matatuListRef$.remove(matatu.key);
          }
        },
        {
          text: 'Cancel',
          role: 'cancel',
          handler: () => {
            //do something
          }
        }
      ]
    }).present();
  }


}

Here's the Matatu structure:

export interface Matatu {
    $key?: string;
    matNumberPlate: string;
    matSacco: string;
    matDriver: string;
    matAccessCode: string;
    matStatus: string;
    matTracker: string;
    matLocation: string;

}

How do I cast the property to any type?

Could you please also add the definition of the Matatu type? — sebaferreras
– sebaferreras, Commented Dec 3, 2017 at 11:49

sebaferreras · Accepted Answer · 2017-12-03 12:41:32Z

2

How do I cast the property to any type?

If you just want to cast that in order to avoid the typescript error, you could do something like this:

// ...
title: `${(<any>matatu).payload.val().matNumberPlate}`,
// ...

And

// ...
this.matatuListRef$.remove((<any>matatu).key);
// ...

That way matatu would be cast to any and the error should be gone.

What I'd recommend, if you can modify the Matatu interface, would be to add those two properties there instead:

export interface Matatu {
    $key?: string;
    matNumberPlate: string;
    matSacco: string;
    matDriver: string;
    matAccessCode: string;
    matStatus: string;
    matTracker: string;
    matLocation: string;

    // New properties are optional
    payload?: any;
    key?: any;
}

That way you don't need to cast the matatu property since both payload and key are part of the definition of the Matatu type (and both are of type any).

edited Dec 3, 2017 at 12:41

answered Dec 3, 2017 at 12:14

sebaferreras

44.7k11 gold badges120 silver badges137 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Ionic3, Typescript - Ignore Typescript Errors “property ' ' does not exist on value of type ' '”

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related