66228

Keyvalue pipe using to print nested values

Question:

Here my stackblitz <a href="https://stackblitz.com/edit/angular-vj4llg" rel="nofollow">https://stackblitz.com/edit/angular-vj4llg</a>

To print nested array values, I am using Keyvalue pipe

Use keyvalue pipe

<ul *ngFor="let stdObj of student"> <li>ID : {{stdObj.id}} Name : {{stdObj.name}} <ng-container *ngFor="let test of stdObj?.value | keyvalue"> {{test.key}} : {{test.value}} </ng-container> </li> </ul>

In typescript

this.student = [ { id:123, name: "Test", value:["{pass: true,verified: true}"] }, { id:435, name:"Test12", value:["{pass: false, verified: true}"] } ]

Expecting ouput as

ID : 123 Name : Test pass : true verified : true

Answer1:

Currently by your definition, value key holds an array of string: ["{...}"], so the output for it will not show what you expected; instead, it will output index value 0 as 'key' value for the first item, while "{...}' as its value.

So in order to get what you expected, re-defined value as below:

value: {pass: true,verified: true}

Recommend

  • C: Ordersystem for Fastfood Project
  • How do I solve a second order differential equation in R?
  • Hide all on sale products on Woocommerce shop page
  • Playing WAV data with AVAudioEngine
  • Increase performance: avoid looking for the right element in a collection
  • Facebook android sdk login dialog
  • CNTK c# logistic regression w and b variable values
  • How to close an html5 color picker?
  • Is there a way to import PST files into Outlook using C#?
  • Python merge multiple list inside one variable into one list [duplicate]
  • Response.Redirect not always redirecting
  • ImportError for Gnuplot in python terminal
  • Access to a single pixel in C#
  • Comparing two images visually
  • How to apply a function to pairs of rows in a data.frame, similar to diff?
  • Is it a good practice to user Fragment.setRetainInstance to not handle recreation?
  • Reading a File while it is being written by another process
  • Checking instance of non-class constrained type parameter for null in generic method
  • how do i post textbox value which is dynamically created by jquery
  • Export a simple Dictionary into Excel file in python
  • Spring batch pause/resume vs stop/restart
  • How to create mirrored image effect with CSS single element
  • How to modify the way a ForeignKey field is rendered in a Django admin page to avoid browser crash?
  • Use AutoIt with java applications
  • Ajax call on Multiple selection in Select box
  • Calculate time from document
  • 'url' requires a non-empty first argument. The syntax changed in Django 1.5, see the docs
  • Amazon Elastick BeanStalk error: Failed to create the AWS Elastic Beanstalk application version
  • Functions by reference or by variable, which to use when?
  • How to get rgb from transparent pixel in js
  • customize soft keyboard key preview
  • Using Service Component Runtime
  • How to use FirstOrDefault inside Include
  • PHP Permalinks.. how to change?
  • media foundation H264 decoder not working properly
  • Running R's aov() mixed effects model from Python using rpy2
  • Access to a Matlab gui from the web
  • ReferenceError: TextEncoder is not defined