Как мне анализировать значения php в ионной сетке

Это ответ, который я получаю через свой html-документ.Guys Я хочу отображать значения в формате таблицы в ionic. Поэтому я использую сетку, чтобы получить тот же результат. Когда дело доходит до анализа данных из ответа json, я сталкиваюсь с множеством проблем. Я создал ответ json и хочу отобразить значения в формате таблицы. Это мой ответ json.

{
    "success": true,
    "data": [{
        "iMISParamCatID": "1",
        "vCatName": "Alerts",
        "iLocID": "1",
        "paramname": "-ve Batches",
        "fValue": "399.00"
    },, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "6",
        "paramname": "Discounts",
        "fValue": "367.48"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "7",
        "paramname": "Discounts",
        "fValue": "530.21"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "1",
        "paramname": "Owners",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "2",
        "paramname": "Owners",
        "fValue": "3869.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "3",
        "paramname": "Owners",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "4",
        "paramname": "Owners",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "5",
        "paramname": "Owners",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "6",
        "paramname": "Owners",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "7",
        "paramname": "Owners",
        "fValue": "343.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "1",
        "paramname": "Staff",
        "fValue": "547.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "2",
        "paramname": "Staff",
        "fValue": "1422.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "3",
        "paramname": "Staff",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "4",
        "paramname": "Staff",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "5",
        "paramname": "Staff",
        "fValue": "1294.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "6",
        "paramname": "Staff",
        "fValue": "175.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "7",
        "paramname": "Staff",
        "fValue": "1227.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "1",
        "paramname": "Margin",
        "fValue": "14.92"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "2",
        "paramname": "Margin",
        "fValue": "19.18"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "3",
        "paramname": "Margin",
        "fValue": "8.87"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "4",
        "paramname": "Margin",
        "fValue": "9.38"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "5",
        "paramname": "Margin",
        "fValue": "17.58"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "6",
        "paramname": "Margin",
        "fValue": "20.65"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "7",
        "paramname": "Margin",
        "fValue": "17.00"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "1",
        "paramname": "Profit",
        "fValue": "13227.30"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "2",
        "paramname": "Profit",
        "fValue": "91215.79"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "3",
        "paramname": "Profit",
        "fValue": "39471.89"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "4",
        "paramname": "Profit",
        "fValue": "27122.51"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "5",
        "paramname": "Profit",
        "fValue": "18488.92"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "6",
        "paramname": "Profit",
        "fValue": "13984.54"
    }, {
        "iMISParamCatID": "2",
        "vCatName": "Sales",
        "iLocID": "7",
        "paramname": "Profit",
        "fValue": "11667.46"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "1",
        "paramname": "Register",
        "fValue": "69150.00"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "2",
        "paramname": "Register",
        "fValue": "-1.00"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "3",
        "paramname": "Register",
        "fValue": "1.00"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "4",
        "paramname": "Register",
        "fValue": "25470.00"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "5",
        "paramname": "Register",
        "fValue": "58819.00"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "6",
        "paramname": "Register",
        "fValue": "42650.00"
    }, {
        "iMISParamCatID": "6",
        "vCatName": "Accounts",
        "iLocID": "7",
        "paramname": "Register",
        "fValue": "68228.00"
    }]
}

Это мой html файл

   <ion-content>
  <ion-grid>
    <ion-row>
      <ion-col>
        Display Date
      </ion-col>
      <ion-col>
        #1
      </ion-col>

      <ion-col>
        #2
      </ion-col>

      <ion-col>
        #3
      </ion-col>
      <ion-col>
        #4
      </ion-col>
      <ion-col>
        #5
      </ion-col>
      <ion-col>
        #6
      </ion-col>
      <ion-col>
        #7
      </ion-col>
      <ion-col>
        Total
      </ion-col>
    </ion-row>
    <ion-row>
      <ion-col>
        Category Name
      </ion-col><br>
    </ion-row>  
  </ion-grid>

  <ion-grid>
      <ion-row>
          <ion-col>
        Category Params 
          </ion-col>
          <ion-row *ngFor = "let category of data?.data">
          <ion-col>
            {{category.fValue}}
          </ion-col>
        </ion-row>
  </ion-row>
  </ion-grid>
</ion-content>

А это мой ts файл.

export class HomePage {
  posts: any;
  leaddetails: any;
  constructor(public navCtrl: NavController,
    private http: Http) {
    // window.open("http://google.com",'_system', 'location=yes');
    let headers = new Headers();
    headers.append('Content-Type', 'application/json');
    let options = new RequestOptions({ headers: headers });

    this.http.post('http://url/foldername/file.php',options) 
    .map(res => res.json())
    .subscribe(data => {
      console.info("Api Fired",data);
    this.data = data;

       });

}

}

Я просто хочу, чтобы значения были напечатаны под именами столбцов, и, как видно из моего ответа выше, мне нужно напечатать vCatName и paramsname. Я новичок в ионных технологиях, мне просто нужно руководство.

С какой именно проблемой вы столкнулись?

— 03.10.2018 10:31

мне нужно распечатать данные в таблице / сетке. поэтому мне нужно прочитать значения из ответа и распечатать его на странице.

— 03.10.2018 10:33

Но вы упомянули, что сталкиваетесь с проблемами, пытаясь это сделать, что это за проблемы?

— 03.10.2018 10:34

данные, когда я пытаюсь распечатать, дают мне эту ошибку data.json не является функцией

— 03.10.2018 10:37

let leaddetails = data.json(); - это твоя проблема. Вы пытаетесь вызвать свойство как функцию.

— 03.10.2018 10:37

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

— 03.10.2018 11:17

Вам нужно разобрать объект JSON.parse().

— 03.10.2018 11:28

добавил эту строку this.data = JSON.parse (this.data); вместо this.data = data

— 03.10.2018 12:04

получить эту ошибку Неожиданный токен u в JSON в позиции 0

— 03.10.2018 12:05

Убедитесь, что ваш ответ правильный JSON.

— 03.10.2018 12:09

Я проверил свой json на jsonlint, и это действительный json

— 03.10.2018 12:44

Я обновил свой ответ, и ваше руководство помогло мне добиться этого результата @ Script47. Теперь мне просто нужно распечатать их по порядку!

— 03.10.2018 13:34

php json ionic-framework

03.10.2018 10:24

Стоит ли изучать PHP в 2026-2027 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Symfony Station Communiqué - 7 июля 2023 г

Это коммюнике первоначально появилось на Symfony Station .

Оживление вашего приложения Laravel: Понимание режима обслуживания

Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...

Установка и настройка Nginx и PHP на Ubuntu-сервере

В этот раз я сделаю руководство по установке и настройке nginx и php на Ubuntu OS.

Коллекции в Laravel более простым способом

Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...

Как установить PHP на Mac

PHP - это популярный язык программирования, который используется для разработки веб-приложений. Если вы используете Mac и хотите разрабатывать...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

export class HomePage {
posts: any;
leaddetails: any;

alldata: Observable<any>; //<-- this add first

и в свой http-пост;

  .subscribe(data => {
  console.info("Api Fired",data);

  this.alldata = data; //<--this add

   });

позже ваш html файл;

 <ion-content>
   <ion-grid>
     <ion-row *ngFor = "let item of alldata">
       <ion-col>
        {{item.iMISParamCatID}}
       </ion-col>
       <ion-col>
        {{item.vCatName}}
       </ion-col>
       <ion-col>
        {{item.iLocID}}
       </ion-col>
       <ion-col>
        {{item.paramname}}
       </ion-col>
       <ion-col>
        {{item.fValue}}
       </ion-col>
     <ion-row>
   <ion-grid>
 <ion-content>

данные не отображаются

— 04.10.2018 08:27

изменен на * ngFor = "let item of alldata? .data" работал у меня

— 04.10.2018 08:44

если я хочу напечатать определенное значение, как мне его распечатать? например: vCatName

— 04.10.2018 08:53

03.10.2018 18:44