Я использую последнюю версию Angular, и в настоящее время я создаю массив строк, представляющих структуру объекта json, например
['id', 'address: street', 'address: zipcode', ..]
следующий фрагмент - это то, чего я достиг до сих пор
<div *ngFor="let prop of propKeys(fetchedData)">
<div *ngIf="checkIfObject(fetchedData[prop])">
<span *ngFor="let subProp of propKeys(fetchedData[prop])" style="padding-left: 15px;">{{addToResult(prop + ':' +subProp)}}</span>
</div>
<div *ngIf="!checkIfObject(fetchedData[prop])">
<span>{{addToResult(prop)}}</span>
</div>
</div>
, и это файл .ts
export class ProjectNewComponent implements OnInit {
fetchedData: any;
nestedResult: any[] = [];
constructor(private _http: HttpClient) {
this._http.get('https://jsonplaceholder.typicode.com/users')
.subscribe((data: any) => {
if(Array.isArray(data))
this.fetchedData = data[0];
else
this.fetchedData = data;
console.log(Object.keys(this.fetchedData));
})
}
ngOnInit() {}
propKeys(obj: any){
return Object.keys(obj);
}
checkIfObject(item: any){
return item instanceof Object;
}
addToResult(val: any){
this.nestedResult.push(val);
return val;
}
printResult(){
console.log(this.nestedResult);
this.nestedResult = [];
}
}
все работает хорошо, за исключением того, что когда я нажимаю кнопку, чтобы напечатать результат, я вижу дублированный результат
['id', 'address: street', 'address: zipcode', 'id', 'address: street']
, даже если вывод html верен
Мой обходной путь - обновить функцию, заполняющую этот список
addToResult(val: any){
if(this.nestedResult.filter(item => item === val).length === 0)
this.nestedResult.push(val);
return val;
}
, ноЯ не могу понять, почему массив имеет дублированные значения.Есть ли какая-то ошибка в коде?