The Dot

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet
Published 11 years ago
Updated 5 years ago

This brief video examines the importance of a single . within your AngularJS application. It uncovers a potential gotcha when it comes to inheritence.

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.

egghead
egghead
~ 21 minutes ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today