5

I have the following html:

enter image description here

I am trying to get the scope like:

console.log("app element scope: " + $('#angularHeaderDiv').scope());

but I received: undefined.

I am angularJS beginner and I simply dont' get why this doesn't work.

UPDATE: This doesn't work either:

var appElement = document.getElementById('angularHeaderDiv');
console.log("app element scope: " + angular.element(appElement).scope());

UPDATE 2: All the code where I try to print out the scope in console:

   angular.module('cmApp', [ 'pascalprecht.translate' ])
.config(function($translateProvider) {

    $translateProvider.useStaticFilesLoader({
        prefix : '/resources/angular/scripts/languages/locale-',
        suffix : '.json'
    });

    // add translation table
    $translateProvider.preferredLanguage('en');

    var appElement = document.getElementById('angularHeaderDiv');
    console.log("app element: " + angular.element(appElement).scope());
});
Cristian Boariu
  • 9,603
  • 14
  • 91
  • 162
  • Hard to say without seeing the javascript. – Mike Robinson Oct 27 '14 at 15:59
  • 3
    What are you trying to do? I don't see why a jQuery collection would have a method `.scope` because you were including Angular – Explosion Pills Oct 27 '14 at 15:59
  • possible duplicate of [How to access the angular $scope variable in browser's console?](http://stackoverflow.com/questions/13743058/how-to-access-the-angular-scope-variable-in-browsers-console) – Patsy Issa Oct 27 '14 at 16:00
  • @ExplosionPills Tried without jquery and received the same (updated the question). – Cristian Boariu Oct 27 '14 at 16:01
  • Angular has no function called `.scope()` @RafaelEyng is right, do you mean `$scope`? Take a look here: https://docs.angularjs.org/guide/scope Or did you create you're own scope method? The reason `.scope()` is undefined is because it doesn't exist – Adjit Oct 27 '14 at 16:06
  • i am not familiar with this. but i think this fiidle may help you http://jsfiddle.net/sXkjc/716/ – Arunkumar Oct 27 '14 at 16:10
  • @CristianBoariu elements don't have scopes like this. Scopes are part of directives. What are you trying to do specifically? – Explosion Pills Oct 27 '14 at 19:08
  • Elements *do* have `scope()` and `isolateScope()` methods on the jQuery (or jqLite) objects in Angular. – FOO Jun 23 '15 at 04:19
  • https://code.angularjs.org/1.3.14/docs/guide/production#disabling-debug-data – FOO Jun 23 '15 at 04:23

2 Answers2

20

If you have this in your code:

$compileProvider.debugInfoEnabled(false);

...then scope() and isolateScope() will return undefined. If it's set to false, you'll notice other things like ng-scope and ng-isolate-scope disappearing out of class= attributes on elements.

See: https://code.angularjs.org/1.3.16/docs/guide/production#disabling-debug-data

FOO
  • 612
  • 5
  • 16
  • Thanks so much! Now I need to find another way to extract scope from an element inside my focus manager directive – Frode Aug 11 '15 at 08:15
  • How would you get scope when debugInfoEnabled is set to false? Are there any other ways to obtain a scope for a element? – Nathan Reese Feb 27 '17 at 23:21
0

I don't think you actually have a scope there. Assuming you meant $scope, it is a environment that is shared between a controller and a portion of your DOM, and it is injected inside of your controller by AngularJS dependency injection mechanism. Besides that, I don't see any association between your '#angularHeaderDiv' and any scope, since this div is not even associated with any controller.

I'm also not very experienced with AngularJS, but actually I've never seen what you are trying to accomplish here.

Edit

Having seen your edit, where you are trying to access the DOM element inside a config, I would say that that is for sure a non-AngularJS way to solve your problem. I suggest you to read more about the framework.

Rafael Eyng
  • 4,720
  • 2
  • 33
  • 34
  • What I want is to get the rootScope and I was thinking that inside the ng-app this should be available... – Cristian Boariu Oct 27 '14 at 16:04
  • As I've said, $scope is an environment shared between the controller and the associated portion of the DOM. You can, yes, have nested scopes, with nested controllers inside your DOM. – Rafael Eyng Oct 27 '14 at 16:05
  • Ok but then this should work: `var appElement = document.getElementById('main'); console.log("app element: " + angular.element(appElement).scope());` because main is already having HeaderCtrl bound to it but this doesn't work either. – Cristian Boariu Oct 27 '14 at 16:07
  • 1
    Point is: you don't have access to your `$scope` (with the dollar) outside your controller. And, inside your controller, I don't see the need to access DOM elements like you are doing. It seems that you are taking a jQuery-ish approach to a AngularJS problem. – Rafael Eyng Oct 27 '14 at 16:10
  • You don't have access to your $scope outside of the controller because it is not even a property, it is passed as parameter to the controller. – Rafael Eyng Oct 27 '14 at 16:12
  • You are right but I need this approach because I have to call it from inside a jquery method after a partial update... so based on this: http://stackoverflow.com/a/15756337/174349 it should work but for some strange reason it doesn't... – Cristian Boariu Oct 27 '14 at 16:12
  • If you are willing to post a plnkr or JSFiddle, I might take a look at it. – Rafael Eyng Oct 27 '14 at 16:13
  • 1
    It's perfectly possible to access a controller's scope from outside the controller. It is not just a parameter. This is the common way to hook into the angular lifecycle from 3rd party plugins. https://docs.angularjs.org/api/ng/function/angular.element#jquery-jqlite-extras. As you point out though, the OP won't be able to do this from the context of the config function, so at least that part is correct. – ivarni Oct 28 '14 at 08:51
  • @ivarni Thanks for the enlightening. I suggest you to elaborate a complete answer and post it, so the OP can accept it. – Rafael Eyng Oct 28 '14 at 10:46
  • This should tell the OP everything they need: http://stackoverflow.com/a/13744085/957731 I don't see any compelling reason to answer a question that already has an answer, I just commented to clear up confusion about $scope vs element.scope() which seemed to be widespread on this question. – ivarni Oct 28 '14 at 10:52