Angular / Ionic - Как сгруппировать данные из двух источников JSON? - PullRequest
Новая
       16

Angular / Ionic - Как сгруппировать данные из двух источников JSON?

0 голосов
/ 22 января 2019

Я хочу сгруппировать данные JSON в список аккордеонов в Ionic. Как я могу сделать это с двумя источниками JSON?

Ранее я успешно справился только с одним JSON.

У меня есть два JSON, которые выглядят так. Один: 

    {
        {
          "ObjectId": '001',
          "ObjectName": 'Fruits'
        },
        {
          "ObjectId": '002',
          "ObjectName": 'Vegetables'
        }
    }

Другой: 

    {
        {
          "Name": 'Apple',
          "Color": 'Red',
          "ObjectId": '001'
        },
        {
          "Name": 'Eggplant',
          "Color": 'Purple',
          "ObjectId": '002'
        },
        {
          "Name": 'Banana',
          "Color": 'Yellow',
          "ObjectId": '001'
        },
        {
          "Name": 'Spinach',
          "Color": 'Green',
          "ObjectId": '002'
        },
        {
          "Name": 'Garlic',
          "Color": 'White',
          "ObjectId": '002'
        },
    }

Вот мой ожидаемый результат: Аккордеон-List

1 Ответ

0 голосов
/ 23 января 2019

Я нашел решение, но я не уверен, что мой метод - лучший.

Вот мой метод: 

// GET DATA API
let getObjectApi = this.dataProvider.getObjectUrl();
new Promise(resolve => {
    getObjectApi.subscribe(data => {
      resolve(data);
      this.apiObjectData = data;

      // LOOPING OBJECT DATA
      for (let i = 0; i < this.apiObjectData.length; i++) {
        const objItem = data[i];

        // GET OBJECT ITEM BY ObjectId
        let getObjectItem = this.getObjectItemByObjectId('ObjectId', objItem['ObjectId']);
        // PUSH THE DATA
        this.apiDataResult.push({
          'dataObject': objItem,
          'dataObjectItem' : getObjectItem 
        });
      }
    }, err => {
      console.log(err);
    });
  });

А вот this.getObjectItemByObjectId() метод:

getObjectItemByObjectId(column, value) {
  let result:any = [];
  let dataApi: any = [];

  let getObjectItemApi = this.dataProvider.getObjectItemUrl();
  new Promise(resolve => {
    getObjectItemApi.subscribe(data => {
      resolve(data);
      dataApi = data;
      for (let i = 0; i < dataApi.length; i++) {
        const element = dataApi[i];
        if (element[column] == value) {
          result.push(element);
        }
      }
    }, err => {
      console.log(err);
    });
  });

  return result;
}

И результат примерно такой: 

{
    {
      "dataObject": {
                      "ObjectId": '001',
                      "ObjectName": 'Fruits'
                    },
      "dataObjectItem": {
                            {
                              "Name": 'Apple',
                              "Color": 'Red',
                              "ObjectId": '001'
                            },
                            {
                              "Name": 'Banana',
                              "Color": 'Yellow',
                              "ObjectId": '001'
                            }
                        }
    },
    {
      "dataObject": {
                      "ObjectId": '002',
                      "ObjectName": 'Vegetables'
                    },
      "dataObjectItem": {
                            {
                              "Name": 'Eggplant',
                              "Color": 'Purple',
                              "ObjectId": '002'
                            },
                            {
                              "Name": 'Spinach',
                              "Color": 'Green',
                              "ObjectId": '002'
                            },
                            {
                              "Name": 'Garlic',
                              "Color": 'White',
                              "ObjectId": '002'
                            }
                        }
    }
}

Вот и все!

Если есть лучший способ, чем мой метод, пожалуйста, дайтея знаю!И извините, если что-то пойдет не так.Заранее спасибо !!

...