Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
Ben Nadel at cf.Objective() 2010 (Minneapolis, MN) with: Jared Rypka-Hauer
Ben Nadel at cf.Objective() 2010 (Minneapolis, MN) with: Jared Rypka-Hauer@ArmchairDeity )

Quick Note: Favor $exceptionHandler() Over $log.error() In AngularJS

By Ben Nadel on

This is just a really minor note. I was looking through some AngularJS code the other day and came across someone using a try-catch block that passed the error off to the $log.error() method. While this works - it logs the error to the console - it doesn't add as much value as the $exceptionHandler() service. There are times when logging to the console makes sense; but, as a general rule, I would try to favor the $exceptionHandler() service over the $log.error() method in the vast majority of cases.

  • <!doctype html>
  • <html ng-app="Demo">
  • <head>
  • <meta charset="utf-8" />
  •  
  • <title>
  • Quick Note: Favor $exceptionHandler() Over $log.error() In AngularJS
  • </title>
  • </head>
  • <body ng-controller="AppController">
  •  
  • <h1>
  • Quick Note: Favor $exceptionHandler() Over $log.error() In AngularJS
  • </h1>
  •  
  • <p>
  • <em>View the console</em>.
  • </p>
  •  
  • <!-- Load scripts. -->
  • <script type="text/javascript" src="../../vendor/angularjs/angular-1.4.2.min.js"></script>
  • <script type="text/javascript">
  •  
  • // I control the root of the application.
  • angular.module( "Demo", [] ).controller(
  • "AppController",
  • function provideAppController( $scope, $log, $exceptionHandler ) {
  •  
  • // ** Avoid. **
  • // --
  • // Using the $log.error() method will safely log the error to the console
  • // if it is available. If the console is not available, the error will
  • // just be swallowed quietly.
  • try {
  •  
  • throw( new Error( "Something went boom."))
  •  
  • } catch ( error ) {
  •  
  • $log.error( error );
  •  
  • }
  •  
  •  
  • // ** Recommended. **
  • // --
  • // By default, the $exceptionHandler() service does the same thing as
  • // $log. The default implementation actually just turns around and calls
  • // $log.error() internally. However, the entire framework defers to the
  • // $exceptionHandler() for all try / catch blocks which makes it a
  • // perfect place to track errors. By favoring $exceptionHandler() over
  • // the $log.error() method, you keep in alignment with the rest of the
  • // code and make your errors more readily available.
  • try {
  •  
  • throw( new Error( "Something went boom."))
  •  
  • } catch ( error ) {
  •  
  • $exceptionHandler( error );
  •  
  • }
  •  
  • }
  • );
  •  
  • </script>
  •  
  • </body>
  • </html>

Out of the box, the default implementation of the $exceptionHandler() service just turns around and calls the $log.error() method. So, you get console-logging for free. The real benefit of the $exceptionHandler() service, however, is two fold: For starters, the rest of the framework uses $exceptionHandler() to manage errors. So, by using the $exceptionHandler() service, you are keeping your code more consistent with the rest of the code (and consistency is always a win).

But, the real benefit of using $exceptionHandler() is that you are passing your error through to a service that has become the de-facto point of override for error logging in the AngularJS community. In my apps, I use the $exceptionHandler() service to gather stack-traces (using Stacktrace.js) and to pass those errors off to New Relic for more aggregated tracking. And, I'm not the only one - a similar approach is also outlined in John Papa's AngularJS Style Guide.

So, long-story-short, favor the $exceptionHandler() unless you truly want to log something without the potentiality of it being logged in a more meaningful way.




Reader Comments

Post A Comment

You — Get Out Of My Dreams, Get Into My Comments
Live in the Now
Oops!
Comment Etiquette: Please do not post spam. Please keep the comments on-topic. Please do not post unrelated questions or large chunks of code. And, above all, please be nice to each other - we're trying to have a good conversation here.