Я новичок в Ionic и пытаюсь перенести сложные данные Json в мой html (где Ionic пригодится).
Что я имею в виду под «сложными» данными Json, Jsons вот так:
{
"Key: "
[
{
"Key: " "Value",
"Key: " "Value"
},
{
"Key: " "Value",
"Key: " "Value"
}
]
}
Проблема здесь для меня - первый ключ.Я видел несколько примеров форматов Json без этого первого ключа. Примеры: https://www.youtube.com/watch?v=imaTBx4jbwY
Теперь у меня есть:
Мой файл .ts:
import { Component } from '@angular/core';
import{HttpClient} from "@angular/common/http";
import { map } from 'rxjs/operators';
@Component({
selector: 'app-tab1',
templateUrl: 'tab1.page.html',
styleUrls: ['tab1.page.scss']
})
export class Tab1Page {
BugList: Object;
constructor(public http: HttpClient){
this.http.get('jsonurl').pipe()
.subscribe(res => this.BugList = res;),
(err) => {
alert("failed loading data");
});
}
}
и для моего html:
<ion-content>
<ion-card *ngFor="let bug of BugList| async">
<ion-card-header>
<ion-card-subtitle>{{bug.Bugs[1].Title}}</ion-card-subtitle>
<ion-card-title></ion-card-title>
</ion-card-header>
</ion-card>
</ion-content>
это дает мне следующую ошибку:
Ошибка: Ошибка: InvalidPipeArgument: '[объект объекта]' для канала 'AsyncPipe' Что означает, что я могу использовать аргумент * ngFor только для массивов, а не сложных объектов Json, верно?
Я также видел другой пример: https://www.youtube.com/watch?v=TD1rKSuC3Zk
он попробовал его следующим образом:
this.http.get('https://randomuser.me/api/?results=10')
.map(res => res.json())
.subscribe(res => {
this.users = res.results;
}, (err) => {
alert("failed loading json data");
});
}
этот вел меня в том направлении, в котором я сейчас нахожусь.Я заменил функцию .map на .pipe в моем файле .ts, потому что .map устарел.Теперь у меня есть ошибка, которая говорит, что Свойство 'results' не существует для типа 'Объект'
Основной вопрос: я действительно борюсь с этим дополнительным ключом, без него не было бы такжесткий.Есть ли способ, которым я могу сделать это динамический , используя методы, показанные?