All language subtitles for 10. Displaying JSON

There's just one last pipe I want to show you very quickly.

And to be honest with you this is probably the most useful one.

It's the Jay some pipe Jay some pipe is really just used for debugging purposes and it even says so

on the documentation right here.

We're almost never going to use the Jason pipe inside of a production application.

The goal to Jason pipe is to just take some kind of a data structure that we created in our typescript

code and print it out as Jason on the screen.

We mostly use it for just displaying data that you and I can take a look at it and understand what kind

of data we are actually working with.

It's really almost on par with a console log but the nice thing about this is that whenever some value

updates inside your component Jason Piper will automatically update as well and update the display of

that object on the screen.

Let's take a look at how we use it.

All right I'm gonna go back over to my component and I'm going to initialize new property on the class.

Remember that means I'm going to declare it and assign it a value in one step and I'll do the old classic

example of a car.

I'm gonna say that my car has How about a make of Toyota and a model of Camry and maybe a year of 2000

really old car.

Now if I wanted to print out this property I could obviously do a console log somewhere inside this

component or alternatively I could try to print it out directly on the screen if I did so right now

by going back over to my template went down to the bottom and then writing out simply car and saving

it.

Let's take a look at what happens though when it actually is displayed on the screen it gets displayed

as object object.

Oh definitely not very useful.

No way whatsoever that I can figure out what is going on inside there.

Instead I might take that car and throw it through the Jason height if I save that.

I'll now see that entire object printed out as Jason again just makes it really easy for you to see

it.

What kind of data is flowing around your application.

We're going to use this pipe several times inside this course just for debugging purposes.

We're gonna make sure that we never actually leave it inside of some production deployment again.

A user doesn't really want to see something like this.

It's not appropriate for them unless you're building some kind of very technical application where you

specifically want to see or have your user see some Jason again.

That's pretty much it for the built in pipes in angular.

Now obviously there are several other pipes inside of here.

But to be honest with you they all basically work the same as the ones we just looked at.

There is one other pipe that we're going to look at eventually called the async pipe or we're going

to hold off on that for right now.

That is an extremely useful pipe but you need to know a couple other things about angular before you

can really see the power and the value of it.

So that's it right now on the built in pipes but I would still like to show you how to build our own

pipes as well.

Quick pause right here.

One last little thing in the next video.