Как сделать описания типов, которые работают с угловыми наблюдаемыми ответами?

Question

Я создаю приложение Angular2 на Firebase, используя angularfire2.

Элементы, возвращаемые из реального времени, имеют дополнительные поля (например, $ key, $ exists), которые могут быть полезны в вашем приложении. Но если вы не укажете эти ключи в своих определениях моделей, машинописные шрифты вызывают ошибки.

Например, у меня есть класс, называемый пункт:

export class Item { 
    name: string, 
    price: number, 
    isOnSale: boolean 
} 

Когда этот элемент возвращается через angularfire2 имеет дополнительные firebase поля (например, $ ключ, $ существует, и т.д.), что я иногда хочу для доступа:

constructor(private af: AngularFire){ 
    this.af.database.list('items').subscribe(items => { 
    items.forEach(item => this.doSomethingWithDbItem(item)); 
    }) 
} 

doSomethingWithDbItemAndThenUpdate(item: Item){ 
    // Now, if I want to access the $key field, I get a typescript error because 
    // $key does not exist on my class definition 

    if(item.name === 'toy_truck'){ 
    const key = item.$key; // Will throw error typescript compile error 
    this.af.database.object(`items/${key}`).set({isOnSale: true}) 
    } 
} 

Есть ли наилучшая практика для этого? Я мог бы добавить ключи db непосредственно к модели. Или, может быть, создать класс FB, который имеет $ key, $ exists и т. Д., А затем, чтобы класс Item и другие классы расширяли FB?

Это немного надуманный пример, поэтому код может быть не совсем прав, но, надеюсь, мой вопрос/вопрос ясен.

Answer 1

items в этом коде:

this.af.database.list('items').subscribe(items => { 
    items.forEach(item => this.doSomethingWithDbItem(item)); 
}) 

будет массив Object экземпляров. Это не будет массив из Item экземпляров. То есть, item instanceof Item будет false.

Таким образом, не имеет большого значения сказать TypeScript, что это то, что они есть.

Вместо этого вы должны использовать интерфейсы для описания модели модели. И если вы должны были использовать интерфейсы, используя базовый интерфейс со свойствами AngularFire2 тривиальна:

export interface AngularFireObject { 
    $exists:() => boolean; 
    $key: string; 
    $value?: any; 
} 

export interface Item extends AngularFireObject { 
    name: string; 
    price: number; 
    isOnSale: boolean; 
}