AngularJS onload - Uncaught ReferenceError: $scope is not defined

Question

I am playing around with different ways of loading an alert on load with angularJS. I saw this method documented:

JS

$scope.init = function () {
  ($window.mockWindow || $window).alert('Hello');
};

HTML

<div data-ng-controller="myCtrl" data-ng-init="init()">
<span id="logo">Just a</span><span id="small" >PREVIEW</span>    
</div>

I get the following error:

Uncaught ReferenceError: $scope is not defined

Can anyone tell me what I am doing wrong with this implementation please?

Wait, if I'm not mistaken $scope only exists inside a controller, whereas your code isn't. In that case it's not so strange $scope isn't defined. — 11684
– 11684, Commented Sep 15, 2013 at 16:48
i've posted this link in your previous question' page , have a look: plnkr.co/edit/uO9l7n?p=preview — Ivan Chernykh
– Ivan Chernykh, Commented Sep 15, 2013 at 16:50
@chemiv Yours seems like another implementation, with a lot more code though — Jimmy
– Jimmy, Commented Sep 15, 2013 at 16:55

Davin Tryon · Accepted Answer · 2013-09-15 17:05:34Z

6

You must define myCtrl in order to have $scope available:

function myCtrl($scope, $window) {
    $scope.init = function () {
      ($window.mockWindow || $window).alert('Hello');
    };
}

Here is an updated fiddle.

Edit: I had to wrap your fiddle with a div that included ng-app. ng-app tells angular where the global scope of the application is. This allows it to compile everything inside and see if it can find any controllers etc.

Also, $scope must be passed in to the implementation of controller myCtrl with any dependencies afterward (in this case $window service).

edited Sep 15, 2013 at 17:05

answered Sep 15, 2013 at 16:55

Davin Tryon

67.4k15 gold badges149 silver badges139 bronze badges

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

2 Comments

Jimmy Over a year ago

Thank you for the reply, but your fiddle still doesn't show the alert on page load, is something else missing?

Davin Tryon Over a year ago

@Jimmy yes, sorry about that, I've updated the fiddle. I had to add ng-app and use the built-in way of initializing angular.

Collectives™ on Stack Overflow

AngularJS onload - Uncaught ReferenceError: $scope is not defined

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related