Iterate a JSON and access keys blindly. Angular2

1

I return from the beginning to Restructure all the question:

I will receive the detail of a Master / detail of AgGrid, the problem is that I do not know how many elements I will receive or what is the key that I will receive, since they will change the elements and keys every x time.

In the 1st image, it is the result I want to obtain, I display the Master and it can be seen mocked that I get 4 groups (In red) (which may vary the number of elements that I will receive.)

And each group can have an x number of elements.

I remember that all this is the detail.

Image 2 is what I'm barely getting at the moment.

The data I have to take out without knowing your password, for example

value['name'] value['text'] 

I'm not good because as I said, the data will come different every x time

The problem is no longer to get that data, that just barely as you can see, I'm already accessing the attributes of the children with a series of objects. Foreach

The structure of the JSON as an example:

 "masterdetail": [ {
          "child1": [
            {
            }
          ],
          "child2": [
            {
            }
          ],
         }]

Remembering that 'x' childs can come and each child can come with 'x' fields.

The problem comes to me when I want to SHOW it in the html (by console it does not work for me)

This is done with this.detailCellRendererParams

template: function(params) {

  --->>>  MIS FOR EACHS.

  return (
          '<div class="aggrid--full-row-container"> ( el contenido )'
         );
      }
    };
  }

I come from PHP and JSP and I have always been able to insert a html output in the foreach, but here, if I put the foreach inside the return it does not leave me.

Then, and as a summary , get the data without the keys, I'm already slowly removing it with the console.log, but showing them inside the return I do not know how to do it because it will not let me put the foreach inside the return.

Thanks to everyone!

    
asked by EduBw 15.05.2018 в 16:24
source

1 answer

1

Thanks to the help of Pablo Lozano and JackNavaRow.

To show in the detailGridOptions a Json which is not known the amount of elements that will bring and each elements you do not know the key that you will have. The solution is:

        const objects = params.data.masterdetail[0];
        const keys = Object.keys(objects);
        let value;
        let content;
        let childKey;
        let result = '<ul>';

        keys.forEach(key => {
          value = objects[key];
          content = value[0];
          console.log('todo el Hijo ', content);
          childKey = Object.keys(content);
          childKey.forEach(childs => {
            console.log('Atributos', childs);
            result = result + '<li><label>' + childs + ':</label>' + content[childs] + '</li>';
          });
          result = result + '</ul>';
        });
        // console.log('template ', params.data.masterdetail);
        return (
          '<div class="aggrid--full-row-container">' + result + '<div ref="eDetailGrid" </div>' + '</div>'
        );

Although it would be necessary to give a bit of CSS for the styles, I already show the data. Thank you very much =)

    
answered by 17.05.2018 / 17:13
source