Why isn't the dot used in the AngularJS model documentation?

Question

In the AngularJS MTV Meetup: Best Practices video (2012/12/11) , Mishko explains: "If you use the ng-model there must be a point somewhere. If you don't have a point, you are doing it wrong .."

However, the very first example (The Basics) on the Angular.JS website seems to contradict it. What gives? Since Angular.JS has changed since the meeting of MTV, what now does it more forgive ng-model?

Answer 1

This small point is very important when considering the complexities of sphere inheritance.

egghead.io the video "The Dot" has a really good overview, as well as this very popular question: What are the nuances of prototype / prototype inheritance in AngularJS?

I will try to summarize it here:

Angular.js uses the inheritance scope to allow a child scope (e.g., a child controller) to see the properties of the parent scope. So, let's say you had a setup like:

<div ng-controller="ParentCtrl"> <input type="text" ng-model="foo"/> <div ng-controller="ChildCtrl"> <input type="text" ng-model="foo"/> </div> </div> 

( Play on JSFiddle )

First, if you launched the application and typed it into the parent input, it will update to reflect it.

However, if you edit the area of ​​the child, the connection to the parent is now disconnected, and the two are no longer synchronized. On the other hand, if you use ng-model="baz.bar" , the link will remain.

The reason this happens is because the child region uses prototypal inheritance to find the value, so until it is never set on the child, it will be deferred to the parent region. But, once it is installed, it is no longer looking for a parent.

If you use an object ( baz ) instead, nothing will ever be set in the scope of the child, and inheritance will remain.

For details on details see https://stackoverflow.com/a/3129/

Answer 2

A point will be required if you prototypically inherit one region from another, for example, in the case of ng-repeat, a new region is created for each position, which is inherited from the parent region. There is no prototype inheritance in the base example, since there is only one scope, but if you have multiple child scopes, then you will run into a problem. The link below will make everything clear.

https://github.com/angular/angular.js/wiki/Understanding-Scopes#ng-repeat

Answer 3

So, to solve this problem, make sure that in JS you first declare the parent:

eg.

 $scope.parent 

and then:

 $scope.parent.child = "Imma child"; 

executing only a child without a parent break will be Angular.