Разбор файла Json глубокого уровня и отображение данных во внешнем интерфейсе Angular

У меня есть данные в формате: данные = {ключ1: значение1, ключ2: [{ключ2_1: значение2_1, ключ2_2: значение2_2}], ключ3: значение3,. . . keyn: valuen}

Я хочу проанализировать глубоко выровненный json и отобразить данные в интерфейсе следующим образом, используя Angular 9: key1: value1 \ n (я использую \ n для обозначения новых строк) key2: (любой интервал или отступ) key2_1: value2_1 \ n ключ2_2: значение2_2 \ n ключ3: значение3 \ n. .. keyn: valuen Если кто-то может помочь, я буду очень признателен.

 

Value: any;
Key: any;
this.Value = Object.entries(this.data)
this.Key = Object.keys(this.data)

<html>
<ul >
    <li *ngFor = "let i of Value">{{i}}</li>
</ul>
</html>

 

можете ли вы предоставить более конкретный фрагмент кода? есть много способов сделать это.   —  person Priyankar Bose    schedule 28.01.2021

Я добавил HTML-файл и файл машинописного текста. «Я не мог сделать глубокий кошелек. Большое спасибо за обращение.   —  person Priyankar Bose    schedule 29.01.2021

См. также:  Как создать JOOQ DSLContext из реактивного соединения MariaDB
Понравилась статья? Поделиться с друзьями:
IT Шеф
Комментарии: 1
  1. Priyankar Bose

    Вероятно, вы можете использовать канал, например json, или создать свой собственный для большего форматирования:

    <ul>
        <li *ngFor="let k of keys">
            {{k}}:{{data[k] | json}}
        </li>
    </ul>
    

    https://stackblitz.com/edit/angular-gbflt7?file=src/app/app.component.html.

    Спасибо, что поделились со мной кодом! Я думаю, что это не совсем то, что я на это смотрю. Для вложенных пар ключей и значений мне также нужны любые отступы или символы новой строки, которые вместо того, чтобы анализировать все это как json. Это будет смотреться визуально интересно. person Priyankar Bose; 29.01.2021

    @PriyankarBose Я думаю, что тогда вы можете создать свой собственный канал. Поступая так, вы обеспечите единообразный способ решения этой проблемы и в других компонентах в будущем. person Priyankar Bose; 29.01.2021

    ! Спасибо за ваш ответ! Не могли бы вы показать пример изготовления трубы? Я хочу сделать его общим. person Priyankar Bose; 01.02.2021

Добавить комментарий

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: