How to bind json object with variable in typescript Angular2?

Question

I have one json file and i want to bind with some variable to show on UI.

  testjson=  {"date":1468497879354,"faulty":"F-3","mileage":"150,900 mls","search":[]}

and in html

<div>
<span>{{ testjson }}</span><--- here i am getting above json object
Date:{{date}}
Faulty:{{faulty}}
Mileage: {{mileage}}
<div>

How do i bind so that i can get perticular object value ??

I also did with parsing i couldnt get value for perticular object testjson = JSON.parse(testjson ); this.assign =testjson .date — Sarvesh Yadav
– Sarvesh Yadav, Commented Jul 14, 2016 at 12:17
I did that way but it showing me error RIGINAL EXCEPTION: TypeError: Cannot read property 'mileage' of undefined — Sarvesh Yadav
– Sarvesh Yadav, Commented Jul 14, 2016 at 12:44

Muhammad Usman · Accepted Answer · 2017-04-11 10:03:37Z

2

You can do it like this:

<div>
   <span>lala</span>
   Date:{{testjson.date}}
   Faulty:{{testjson.faulty}}
   Mileage: {{testjson.mileage}}
<div>

Muhammad Usman

3551 silver badge12 bronze badges

answered Jul 14, 2016 at 12:32

karina

8291 gold badge10 silver badges27 bronze badges

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

2 Comments

I did that way but it showing me error RIGINAL EXCEPTION: TypeError: Cannot read property 'mileage' of undefined

Can you please provide an example, cause as you see in plunker all works. May be you forget to fill testjson with some data?

Jim · Accepted Answer · 2016-07-14 15:32:24Z

0

The values may be obtained directly using string interpolation.

{{testjson.date}}
{{testjson.faulty}}

etc...

that's it :)

Jim

16.2k17 gold badges89 silver badges174 bronze badges

answered Jul 14, 2016 at 12:38

Akshay Rao

3,5441 gold badge17 silver badges19 bronze badges