Angular Core

Angular Core Inspect Raw DOM Event


This course has been updated! We now recommend you take the Angular 9 Fundamentals course.

Check out a free preview of the full Angular Core course:
The "Inspect Raw DOM Event" Lesson is part of the full, Angular Core course featured in this preview video. Here's what you'd learn in this lesson:

Lukas demonstrates how the safe navigation operator can help inspect raw DOM elements.

Get Unlimited Access Now

Transcript from the "Inspect Raw DOM Event" Lesson

>> Speaker 1: So now we've seen the event come through. Let's assign this to,
>> Speaker 1: A local property. Now,
>> Speaker 1: That we've assigned this, how do we know which one we've selected? Well, we could just dump it into the template. So we'll go back here, and let's do this.
>> Speaker 1: Handy pretag, we'll go selectedProject, and we'll set this to json.

>> Speaker 1: Look at this.
>> Speaker 1: So as we select we're going through, so this is just to kind of set the stage, not super useful, but eventually we'll drop a form in here, and then actually use this information to populate form so you can update. Let's go a little bit further, and let's do something fun here.

[00:01:08] So we know the project, it's selected, let's go, selectedProject. Not selectProject, let's go selectedProject, and let's go, title. Let's save this. Let's see what happens. I would imagine if I go down here, there's an error. Like, can I read property of undefined? And so you will run into occasions where you bind into something that just doesn't exist yet.

[00:01:39] And what do you do? Pray tell.
>> Speaker 1: You can do a couple things. So, you can add in the safe navigation operator. So, what it would do, it will say does, it exist?
>> Speaker 2: Is that typescript or is that angular-
>> Speaker 1: That's angular.
>> Speaker 2: That's angular, okay.
>> Speaker 1: Yeah.