How to quickly inspect an Angular scope in your webkit browser

Current webkit browsers like Chrome and Safari have a special variable in their consoles that refers to the selected DOM node in the elements panel. This lets us easily inspect Angular scopes.

0. Right click in the page and click "Inspect" to open the Dev Tools

1. Select the element you're interested in from the elements panel

2. Focus the console (in Chrome, hit ESC)

3. Get the scope object and store it

   s=$($0).scope()
   
   // That is:
   element = $0 // Store element
   $element = $(element) // Wrap with jQuery
   scope = $element.scope() // Get and store the scope