Угловой ngДля использования карты - PullRequest
Новая
       13

Угловой ngДля использования карты

0 голосов
/ 03 мая 2018

Я использую ionic 3, таким образом, angular и машинопись.

Я пытаюсь использовать ngFor с типом Map.

Вот что у меня есть: 

interface IShared_Position {
lat: number;
lng: number;
time: number;
color?: string;
}
public shared_position = new Map<string, IShared_Position>();

А теперь со стороны html у меня есть: 

    <ion-list>
  <ion-item ion-item *ngFor="let item of shared_position">
    <h2>{{ item.time }}</h2>
  </ion-item>

Теперь это дает мне следующую ошибку:

Ошибка: не удается найти другой поддерживающий объект «[карта объекта]» типа «объект». NgFor поддерживает только привязку к итерациям, таким как массивы.

Теперь есть ли какой-нибудь способ, которым я не могу связать свою карту, даже если она не повторяется?

Что мне делать?

1 Ответ

0 голосов
/ 03 мая 2018

если вам нужны только значения, вы можете выполнить итерации по этим

HTML: 

<ion-item ion-item *ngFor="let item of getValues()">
    <h2>{{ item.time }}</h2>
</ion-item>

ц 

getValues(): Array<IShared_Position> {
    return Array.from(this.shared_position.values());
}

если вам нужны оба значения, вы можете преобразовать карту в итерируемый объект, содержащий массивы с ключом с индексом 0 и значением с индексом 1, используя функцию entries:

HTML: 

<ion-item ion-item *ngFor="let item of getEntries()">
    <h2>key: {{ item[0] }} - time: {{item[1].time}}</h2>
</ion-item>

ц 

getEntries(): [string, IShared_Position] {
    return Array.from(this.shared_position.entries());
}
...