Can you log angular data-binding errors?

Question

is there anyway to log if a bound property or expression fails?

i.e.

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

Log when user or name is undefined?

Edit: There seems to be a lot of confusion about how this could happen. Lets assume I use a viewmodel for multiple views (Or I'm very forgetful)

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

Answer 1

As others have mentioned in the comments, the data binding won't "fail" per se when the attribute is not defined in the scope, but will create that attribute on the scope transparently.

If you want some notification behaviour when the name isn't found, you can get it manually by decorating the ng-model directive to check if its value is defined on the scope at the time it's 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 for a definition of the ng-model value in the controller's scope and alert if it's not set.

See a working jsfiddle of how this might log a typo.

I haven't tested this in or thought about every scenario, so it's possible it's really broken somewhere... I'm also unsure of how it'll deal with finding attrs that are defined in the parent's scope.

Also, see this nice blog post for more on decorating directives.