Can you log angular errors for data binding?

Question

is there anyway log if the associated property or expression fails?

i.e.

<input type="text" ng-model="user.name" /> 

Log when the user or name is undefined?

Edit: There seems to be a lot of confusion about how this can happen. Suppose I use a viewmodel for multiple views (or I'm very forgetful)

Imaginge that I change the JS code so that the name is now user.firstName, and I forgot to update my view. I would like it to register at runtime, so I can fix it.

Answer 1

As mentioned in the comments, data binding will not “fail” by itself when an attribute is not defined in scope, but will create this attribute in the scope transparently.

If you need some kind of notification behavior when the name is not found, you can get it manually by decorating the ng-model directive to check if its value is defined in the area at the time it is inserted into the DOM.

 .config(['$provide', function($provide) { $provide.decorator('ngModelDirective', ['$delegate', function($delegate){ var directive = $delegate[0]; // Save the old link function var link = directive.link; directive.compile = function() { return function(scope, element, attrs) { link.apply(this, arguments); // Now that we've applied the old link function, we can add // any extra checks or steps we want if (!objHasProperty(scope, attrs.ngModel)) { alert("using ng-model value '" + attrs.ngModel +"' that wasn't defined first!" } }; }; return $delegate; }]); }]) 

This will check the definition of the ng-model value in the controller area and a warning if it is not set.

Check out the working jsfiddle on how this might spell a typo.

I did not test this and did not think about all the scenarios, so it can really be broken somewhere ... I am also not sure how this will concern the search for attrs that are defined in the parent area.

Also, see this nice blog post for a more detailed description of directives.