The Dot

John Lindquist: Let's take a step back and talk about this dot right there and talk about why it's so important.

Let's add another input and let's put it right here, so it's more on the root scope. With an ngModel data message, and then display the message, the data message. Then let's copy this and paste this in the first controller and duplicate that and create a second controller.

We're also going to need, we'll delete that and create a second controller here. All right.

We're all set up to have root, first, second. You can see as I go through these, it still updates as I switch between the different inputs.

If you don't include the dot in there, if you don't create a data object and put the message property on that object, let's see what happens. We'll just replace everything in data dot message with just message. You'll see a lot of examples like this.

Now if I refresh, you'll see root, first, second. You can see that this is, the behavior is completely changed. This doesn't update with the first controller or the second.

Basically, what's happened is you've overwritten this message property in the new scope, so first controller and second controller. They're no longer communicating with each other. You've destroyed that. That scope inheritance that existed before.

If you want to keep that intact and this can also come into play when you're injecting properties and services and stuff that you want to bind to. If you want to keep that intact, always make sure you're creating a model like that, like this data message. That's just our model that will bind everywhere.