3

This is a silly question, but I was working on an AngularJS app (a simple school project), and wanted to know if there was a way to modify the JavaScript object once it's running in chrome from Chrome's Developer tools. Basically, I have a character and a monster, and I wanted to edit the strength of them in the fight to speed up my debugging process (to avoid setting the value in the source code and then refreshing the page).

My guess is there isn't a way to do that because it could become some "security problem", but I just wasn't sure.


Edit: This is the answer. I just didn't know how to search for it. :)

1
  • For editing with AngularJS, drop a line of debugger; in your code and you can inspect (hover over) an object, observe all properties, and it'll pause your browser's JS execution until you step through/into or continue. Commented Apr 18, 2015 at 2:16

2 Answers 2

5
  1. Hit F12
  2. go to the console tab
  3. start executing any javascript.

character.strength = 12 or whatever will work as long as character is globally available.

Sign up to request clarification or add additional context in comments.

3 Comments

k, Maybe I should edit my question. Would you have any idea of how to find the AngularJS $scope variable?
I found that right after I asked. :) Thanks.
0

Tons of help came from this answer. I just didn't know how to search for it. :)

The console is my friend...

  1. Hit F12
  2. Go to the console tab
  3. Start executing any javascript:

To get the angular stuff, I needed to:

  1. get to the controller
  2. grab the scope,
  3. then the object
  4. then the value...

So this worked perfectly!

angular.element('[ng-controller=BattleCtrl]').scope().monster.currentHealth = 25

Thanks for your guidance.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.