convert objects into an array

Question

I have response like below

    dropdown1: {enabled: true, label: "Country", eformVisible: false}
dropdown2: {enabled: false, label: "Dropdown2 Label", eformVisible: false, }
dropdown3: {enabled: false, label: "Dropdown3 Label", eformVisible: false, mandatory: "NOT_MANDATORY[enter link description here][1]", order: 32}
dropdown4: {enabled: false, label: "Dropdown4 Label", eformVisible: false, }
dropdown5: {enabled: false, label: "Dropdown5 Label", eformVisible: false, }
text1: {enabled: true, label: "Text1 Custom field", eformVisible: false, mandatory: "ADMIN_API", order: 0, …}
text2: {enabled: false, label: "Text2 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 1, …}
text3: {enabled: false, label: "Text3 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 2, …}
text4: {enabled: false, label: "Text4 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 3, …}
text5: {enabled: false, label: "Text5 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 4, …}
text6: {enabled: false, label: "Text6 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 5, …}

convert text 1,text2,text3 into text array and same dropdown object move into dropdown array .finally i need to bind this textbox and dropdown value using for loop if i am not wrong . this below i have written sample code

[1]: https://stackblitz.com/edit/angular-ivy-zzeijq

but from this difficult to find which one is textbox and drop down to bind in angular.

Please include all relevant code in the question itself, not just on StackBlitz or any external site. See How to Ask for more tips. — Heretic Monkey
– Heretic Monkey, Commented Apr 19, 2021 at 16:19

Francesco Lisandro · Accepted Answer · 2021-04-19 20:11:37Z

3

Create a function that helps you to filter data according to the beginning of the string (data key):

function filter(data, query){
  return Object.values(Object.keys(data)
  .filter(key => new RegExp('^' + query, 'g').test(key))
  .map((key) => data[key]));
}

And then use it according to your needs:

console.log(filter(data,'date'));
console.log(filter(data,'text'));
console.log(filter(data,'dropdown'));

Insights

edited Apr 19, 2021 at 20:11

answered Apr 19, 2021 at 16:21

Francesco Lisandro

7205 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Papanwar Priyanka Over a year ago

francesco your answer is working thank you.

Dharman · Accepted Answer · 2021-04-19 16:25:46Z

You can browse object by keys and build groupedItem object like following :

    const obj = {
        dropdown1: {enabled: true, label: "Country", eformVisible: false},
        dropdown2: {enabled: false, label: "Dropdown2 Label", eformVisible: false, },
        dropdown3: {enabled: false, label: "Dropdown3 Label", eformVisible: false, mandatory: "NOT_MANDATORY[enter link description here][1]", order: 32},
        dropdown4: {enabled: false, label: "Dropdown4 Label", eformVisible: false, },
        dropdown5: {enabled: false, label: "Dropdown5 Label", eformVisible: false, },
        text1: {enabled: true, label: "Text1 Custom field", eformVisible: false, mandatory: "ADMIN_API", order: 0},
        text2: {enabled: false, label: "Text2 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 1},
        text3: {enabled: false, label: "Text3 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 2},
        text4: {enabled: false, label: "Text4 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 3},
        text5: {enabled: false, label: "Text5 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 4},
        text6: {enabled: false, label: "Text6 Label ", eformVisible: false, mandatory: "NOT_MANDATORY", order: 5}
    };
    
    const grouped = { text: [], dropdown: [] };
    Object.keys(obj).forEach((key) => {
        (key.includes('text')) ? grouped.text.push({...obj[key], initialKey: key}) : grouped.dropdown.push({...obj[key], initialKey: key});
    });

Cody E · Accepted Answer · 2021-04-19 20:19:54Z

1

My solution to these types of problems follow this structure

const children = Object.keys(obj)
.filter(key => <return true for the keys I want>)
.map(key => <Construct textbox based on obj[key]>)

Fill in the blanks and this will output an array of elements which can be bound to your parent element

answered Apr 19, 2021 at 20:19

Cody E

19911 bronze badges

Collectives™ on Stack Overflow

convert objects into an array

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related