"[ts] Cannot find name 'Item'."

Question

I'm following the instructions from here to try out Firebase Firestore:

In the following code block in the app.component.ts file, I get the following error:

[ts] Cannot find name 'Item'.

import { Component } from '@angular/core';
import { AngularFirestore, AngularFirestoreDocument } from 'angularfire2/firestore';
import { Observable } from 'rxjs/Observable';

@Component({
  selector: 'app-root',
  template: `
    <div>
      {{ (item | async)?.name }}
    </div>
  `
})
export class AppComponent {
  private itemDoc: AngularFirestoreDocument<Item>;
  item: Observable<Item>;
  constructor(private afs: AngularFirestore) {
    this.itemDoc = afs.doc<Item>('items/1');
    this.item = this.itemDoc.valueChanges();
  }
  update(item: Item) {
    this.itemDoc.update(item);
  }
}

My question is, what is the Item type they are using in the documentation? Should I be declaring this type manually somewhere? Or am I missing something else?

Answer 1

The "Item" is indeed a interface you've got to define. I defined it in the same .ts file (but I guess I could do it properly in a different file by referencing it...

Beetween import and @Component :

interface MyObjectInterface {
   name: string;
   ...
}

and then in the export class AppComponent block

private itemDoc: AngularFirestoreDocument<MyObjectInterface>;

etc.

It works for me, I could get data from firestore this way