Вызов метода для приведенного класса Typescript

Question

Я использую Cloud Firestore для приведения к объекту, который работает нормально.Однако кажется, что я не могу вызвать методы для этого объекта.Вот мое определение модели -

contact.ts

export class Contact {
  id: string
  firstname: string
  lastname: string
  email: string

  getFullname() {
    return this.firstname + this.lastname
  }
}

contact.service.ts

@Injectable()
export class ContactService {
  getAll(raiseId: string): Observable<Contact[]> {
    this.contactsCollection = this.afs.collection<IContact>('contacts')
    this.contacts$ = this.contactsCollection.snapshotChanges().pipe(
      map(actions => actions.map(a => {
        const contact = a.payload.doc.data() as Contact;
        const id = a.payload.doc.id;
        return { id, ...contact };
      }))
    );
    return this.contacts$;
  }
}

contact.component.ts

@Component({
  selector: 'contact-view',
  templateUrl: './contact-view.component.html',
  styleUrls: ['./contact-view.component.scss']
})
export class ContactViewComponent implements OnInit {
  contacts$: Observable<Contact[]>;
  contacts: Contact[];

  constructor(
    public contactService: ContactService
  ) { }

  ngOnInit() {
      this.contacts$ = this.contactService.getAll();
      this.contacts$.subscribe(contacts => {
        this.contacts = contacts;
      })
    })
  }
}

component.component.html

<div *ngFor="let contact in contacts">{{contact.getFullname()}}</div>

Но метод getFullname() просто выдает ошибку

TypeError: _v.context. $ Implicit.getFullname не является функцией

Может кто-нибудь объяснить, почему это так, если есть способ вызвать функцию при приведенииобъект

Answer 1

Вы не можете просто привести объект, возвращенный Firestore, к какому-либо объекту и предположить, что он просто будет работать.Объект, который вы получаете при вызове data (), представляет собой простой старый объект JavaScript со свойствами, соответствующими полям документа.Это все.У него нет никаких методов, и приведение этого объекта к чему-то другому не создает никаких методов для вас.Приведение просто меняет представление TypeScript о том, что это за объект, и в этом случае вы просто обманули TypeScript, заставив его думать, что у вас есть экземпляр Contact, а на самом деле у вас его нет.

Если вы хотите превратить этоFirestore объект данных в объект Contact, вам нужно будет скопировать свойства объекта данных в новый объект Contact.Простой способ сделать это - использовать Object.assign () .