How do I debug/dump a value from an ng-bind {{ }} Angular expression?
The recommended way is to use AngularJS's logging service $log
. First you need to inject the service into your controller and assign it to a scope variable like so:
app.controller('MyCntrl', function($log){
$scope.$log = $log;
Then in your template, us it like ay other function:
<span>{{$log.log(value}}</span>
If you want to be able to use typeof, it works basically the same way:
$scope.getTypeOf = function(val){ return typeof val; };
<span>{{getTypeOf(val)}}</span>
The built-in JsonPipe might be easier...
{{ object | json }}
See: https://angular.io/api/common/JsonPipe
You can add a custom filter for debugging purposes:
app.filter('debug', function() {
return function(input) {
if (input === '') return 'empty string';
return input ? input : ('' + input);
};
});
Usage:
{{ value | debug }}
Demo: http://plnkr.co/edit/U44BCjBhgsFedRkHASlc?p=preview