Home > Mobile >  How to get the array inside array of json response in angular 10?
How to get the array inside array of json response in angular 10?

Time:10-14

  "CongnitiveSearchResult":{
      "value":[
         {
            "@search.score":6.755926,
            "Id":"932b3a70-630e-4fb8-3a8d-08d91c6c03ac",
            "Name":"ZBS Closed Loop",
            "ShortDescription":"All six phases of the ZBS closed loop framework which help drive sustainable outcomes for clients",
            "Description":"All six phases of the ZBS closed loop framework which help drive sustainable outcomes for clients",
            "Date":"2021-05-21T15:20:49.317Z",
            "Type":"Project Model",
            "DisplayOrder":31,
            "ArchetypeVersionUId":"e959266c-0711-443b-6b1b-08d91c6c03d4",
            "RelatedArchTypeName":"",
            "RelatedToolName":"Enterprise Value Targeting",
            "PHASENAME":"Value Targeting",
            "SUBPHASENAME":"2.2 Quantify",
            "Tags":"Cross-Function, ZBS Closed Loop, ZBX, ZBS, Zero Based, Zero Based Spend, Visibility, Value Targeting, Category Ownership, Budgeting, Zero Based Budgeting, Execute Initiatives, Control, Monitoring",
            "IsRecommended":true,
            "isFavourite":false,
            "Duration":"",
            "PhaseCount":6,
            "Score":40.0,
            "WebsiteUrl":null,
            "ActivityName":"",
            "productContacts":null,
            "productIndustries":null,
            "productIndustrieFunctions":null,
            "ArchetypeIndustries":[
               {
                  "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryUId":"b088760a-ba6e-4058-c8e1-08d91c6c03f1",
                  "Code":null,
                  "Name":"Cross Industry",
                  "Description":"Cross Industry",
                  "DisplayOrder":1
               },
               {
                  "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryUId":"c8014dc7-60bc-eb11-9173-3822e2242831",
                  "Code":null,
                  "Name":"ZBX",
                  "Description":"ZBX",
                  "DisplayOrder":100040001000100000
               },
               {
                  "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryUId":"c9014dc7-60bc-eb11-9173-3822e2242831",
                  "Code":null,
                  "Name":"ZBS",
                  "Description":"ZBS",
                  "DisplayOrder":100040001000200000
               }
            ],
            "ArchetypeIndustryFunctions":[
               {
                  "ProductVersionIndustryFunctionUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryFunctionId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryFunctionUId":"2f7f9af1-b81f-4a05-c8e2-08d91c6c03f1",
                  "Code":null,
                  "Name":"Cross-Function",
                  "Description":"Cross-Function",
                  "RowStatusUId":null,
                  "DisplayOrder":1
               }
            ],
            "ActivityModelGroups":null,
            "DisplayTags":[
               "Cross-Function",
               "Cross Industry",
               "ZBX",
               "ZBS"
            ]
         },
         {
            "@search.score":5.6102304,
            "Id":"00000030-0000-0000-0000-000000000000",
            "Name":"ZBSC Spend Assessment",
            "ShortDescription":"The objective of Visibility and Value Targeting is to map the current organization, compare it to internal and external benchmarks before arriving at agreed targets for the key categories across the Supply Chain",
            "Description":"The objective of Visibility and Value Targeting is to map the current organization, compare it to internal and external benchmarks before arriving at agreed targets for the key categories across the Supply Chain",
            "Date":"2021-05-18T14:13:05.91Z",
            "Type":"Project Model",
            "DisplayOrder":30,
            "ArchetypeVersionUId":"00000030-0010-0000-0000-000000000000",
            "RelatedArchTypeName":"",
            "RelatedToolName":"Enterprise Value Targeting",
            "PHASENAME":"Value Targeting",
            "SUBPHASENAME":"2.2 QUANTIFY",
            "Tags":"Cross-Function, ZBSC Spend Assessment, ZBx, ZBS, Retail, Oil & Gas, Manufacturing, Cost transformation, Strategic Cost Transformation , AI",
            "IsRecommended":true,
            "isFavourite":false,
            "Duration":"3-6 months",
            "PhaseCount":2,
            "Score":40.0,
            "WebsiteUrl":null,
            "ActivityName":"",
            "productContacts":null,
            "productIndustries":null,
            "productIndustrieFunctions":null,
            "ArchetypeIndustries":[
               {
                  "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryUId":"7ad63249-64ad-eb11-ba5f-002b671584c6",
                  "Code":null,
                  "Name":"Retail",
                  "Description":"Retail",
                  "DisplayOrder":100020001000100000
               },
               {
                  "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryUId":"7bd63249-64ad-eb11-ba5f-002b671584c6",
                  "Code":null,
                  "Name":"Oil & Gas",
                  "Description":"Oil & Gas",
                  "DisplayOrder":100020001000200000
               },
               {
                  "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryUId":"7cd63249-64ad-eb11-ba5f-002b671584c6",
                  "Code":null,
                  "Name":"Manufacturing",
                  "Description":"Manufacturing",
                  "DisplayOrder":100020001000300000
               }
            ],
            "ArchetypeIndustryFunctions":[
               {
                  "ProductVersionIndustryFunctionUId":"00000000-0000-0000-0000-000000000000",
                  "ProductVersionIndustryFunctionId":0,
                  "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
                  "IndustryFunctionUId":"9d001512-65ad-eb11-ba5f-002b671584c6",
                  "Code":null,
                  "Name":"Cross-Function",
                  "Description":"Cross-Function",
                  "RowStatusUId":null,
                  "DisplayOrder":100020002000100000
               }
            ],
            "ActivityModelGroups":null,
            "DisplayTags":[
               "Cross-Function",
               "Retail",
               "Oil & Gas",
               "Manufacturing"
            ]
         }

I want to get displaytags length in each response for ex. response[o] has displaytags length 3 and I have to get it similarly for each response. I have to get and loop it in html for each div. The problem here is length is not exactly given for each response it is taking differently for ex, 0th response length is 1 but actual length is 3 and so I don't know what is happening. Please note displaytags may also be empty or null sometimes.

CodePudding user response:

You can do it like this:

let response_displaytags_lengths = CongnitiveSearchResult.value.map(item => item.DisplayTags? item.DisplayTags.length: 0);

Here is working example:

const CongnitiveSearchResult = {
  "value":[
     {
        "@search.score":6.755926,
        "Id":"932b3a70-630e-4fb8-3a8d-08d91c6c03ac",
        "Name":"ZBS Closed Loop",
        "ShortDescription":"All six phases of the ZBS closed loop framework which help drive sustainable outcomes for clients",
        "Description":"All six phases of the ZBS closed loop framework which help drive sustainable outcomes for clients",
        "Date":"2021-05-21T15:20:49.317Z",
        "Type":"Project Model",
        "DisplayOrder":31,
        "ArchetypeVersionUId":"e959266c-0711-443b-6b1b-08d91c6c03d4",
        "RelatedArchTypeName":"",
        "RelatedToolName":"Enterprise Value Targeting",
        "PHASENAME":"Value Targeting",
        "SUBPHASENAME":"2.2 Quantify",
        "Tags":"Cross-Function, ZBS Closed Loop, ZBX, ZBS, Zero Based, Zero Based Spend, Visibility, Value Targeting, Category Ownership, Budgeting, Zero Based Budgeting, Execute Initiatives, Control, Monitoring",
        "IsRecommended":true,
        "isFavourite":false,
        "Duration":"",
        "PhaseCount":6,
        "Score":40.0,
        "WebsiteUrl":null,
        "ActivityName":"",
        "productContacts":null,
        "productIndustries":null,
        "productIndustrieFunctions":null,
        "ArchetypeIndustries":[
           {
              "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryUId":"b088760a-ba6e-4058-c8e1-08d91c6c03f1",
              "Code":null,
              "Name":"Cross Industry",
              "Description":"Cross Industry",
              "DisplayOrder":1
           },
           {
              "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryUId":"c8014dc7-60bc-eb11-9173-3822e2242831",
              "Code":null,
              "Name":"ZBX",
              "Description":"ZBX",
              "DisplayOrder":100040001000100000
           },
           {
              "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryUId":"c9014dc7-60bc-eb11-9173-3822e2242831",
              "Code":null,
              "Name":"ZBS",
              "Description":"ZBS",
              "DisplayOrder":100040001000200000
           }
        ],
        "ArchetypeIndustryFunctions":[
           {
              "ProductVersionIndustryFunctionUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryFunctionId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryFunctionUId":"2f7f9af1-b81f-4a05-c8e2-08d91c6c03f1",
              "Code":null,
              "Name":"Cross-Function",
              "Description":"Cross-Function",
              "RowStatusUId":null,
              "DisplayOrder":1
           }
        ],
        "ActivityModelGroups":null,
        "DisplayTags":[
           "Cross-Function",
           "Cross Industry",
           "ZBX",
           "ZBS"
        ]
     },
     {
        "@search.score":5.6102304,
        "Id":"00000030-0000-0000-0000-000000000000",
        "Name":"ZBSC Spend Assessment",
        "ShortDescription":"The objective of Visibility and Value Targeting is to map the current organization, compare it to internal and external benchmarks before arriving at agreed targets for the key categories across the Supply Chain",
        "Description":"The objective of Visibility and Value Targeting is to map the current organization, compare it to internal and external benchmarks before arriving at agreed targets for the key categories across the Supply Chain",
        "Date":"2021-05-18T14:13:05.91Z",
        "Type":"Project Model",
        "DisplayOrder":30,
        "ArchetypeVersionUId":"00000030-0010-0000-0000-000000000000",
        "RelatedArchTypeName":"",
        "RelatedToolName":"Enterprise Value Targeting",
        "PHASENAME":"Value Targeting",
        "SUBPHASENAME":"2.2 QUANTIFY",
        "Tags":"Cross-Function, ZBSC Spend Assessment, ZBx, ZBS, Retail, Oil & Gas, Manufacturing, Cost transformation, Strategic Cost Transformation , AI",
        "IsRecommended":true,
        "isFavourite":false,
        "Duration":"3-6 months",
        "PhaseCount":2,
        "Score":40.0,
        "WebsiteUrl":null,
        "ActivityName":"",
        "productContacts":null,
        "productIndustries":null,
        "productIndustrieFunctions":null,
        "ArchetypeIndustries":[
           {
              "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryUId":"7ad63249-64ad-eb11-ba5f-002b671584c6",
              "Code":null,
              "Name":"Retail",
              "Description":"Retail",
              "DisplayOrder":100020001000100000
           },
           {
              "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryUId":"7bd63249-64ad-eb11-ba5f-002b671584c6",
              "Code":null,
              "Name":"Oil & Gas",
              "Description":"Oil & Gas",
              "DisplayOrder":100020001000200000
           },
           {
              "ProductVersionIndustryUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryUId":"7cd63249-64ad-eb11-ba5f-002b671584c6",
              "Code":null,
              "Name":"Manufacturing",
              "Description":"Manufacturing",
              "DisplayOrder":100020001000300000
           }
        ],
        "ArchetypeIndustryFunctions":[
           {
              "ProductVersionIndustryFunctionUId":"00000000-0000-0000-0000-000000000000",
              "ProductVersionIndustryFunctionId":0,
              "ProductVersionUId":"00000000-0000-0000-0000-000000000000",
              "IndustryFunctionUId":"9d001512-65ad-eb11-ba5f-002b671584c6",
              "Code":null,
              "Name":"Cross-Function",
              "Description":"Cross-Function",
              "RowStatusUId":null,
              "DisplayOrder":100020002000100000
           }
        ],
        "ActivityModelGroups":null,
        "DisplayTags":[
           "Cross-Function",
           "Retail",
           "Oil & Gas",
           "Manufacturing"
        ]
     }
  ]
}
     
let response_displaytags_lengths = CongnitiveSearchResult.value.map(item => item.DisplayTags? item.DisplayTags.length: 0);
console.log(response_displaytags_lengths)

CodePudding user response:

If you want to iterate them in template then take DisplayTags array instead of just their length.

To get all DisplayTags array

  displayTags: string[][];

  constructor() {
    this.displayTags = CongnitiveSearchResult.value.map((o) =>
      o.DisplayTags ? o.DisplayTags : []
    );
  }

In template to iterate:

<div *ngFor="let arr of displayTags">
  <div *ngFor="let item of arr">
    {{ item }}
  </div>
  <hr />
</div>

Demo

  • Related