Angular JS code is not working

Question

I have no idea why when I do an AngularJS tutorial that it doesn't work in my browser. I'm new to AngularJS. Any insights would be great. I have 3 files.

index.html:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>First Angular App</title>
        <script src="angular.js"></script>
        <script src="app.js"></script>
        <script src="core.js"></script>
    </head>
    <body>
      <div id="main_div" ng-app='my_ang_app' ng-controller='first_div'>
       {{message}}
      </div>
    </body>
    </html>

app.js:

var app = angular.module('my_ang_app', []);

core.js:

app.controller('first_div', function ($scope) {
     $scope.message="Hello world from angular";
    });

When I preview it in the browser it shows {{message}}

Your Angular code and corresponding html are syntactically and semantically correct. The only things I can surmise that would be wrong are your file paths or file names. — Grant Park
– Grant Park, Commented Jul 21, 2016 at 1:25

Sajeetharan · Accepted Answer · 2016-07-21 01:31:10Z

1

Check whether the javascript files you refered are loaded correctly and its always better if you refer them after loading the view. Something like below,

  <body>
    <div id="main_div" ng-app='my_ang_app' ng-controller='first_div'>
    {{message}}
    </div>
    <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js"></script>
    <script type="text/javascript" src="app.js"></script>
    <script type="text/javascript" src="core.js"></script>
    </body>

Here is the working App

answered Jul 21, 2016 at 1:31

Sajeetharan

223k65 gold badges370 silver badges409 bronze badges

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

1 Comment

Brent Nicolet Over a year ago

I moved them to the bottom and its working now. Thanks!

Ashwin Ramaswami · Accepted Answer · 2016-07-21 01:37:32Z

0

I think your problem is that you are not linking to the proper javascript file paths. Try to inspect element to see if you have any 404 errors.

answered Jul 21, 2016 at 1:37

Ashwin Ramaswami

91313 silver badges22 bronze badges

Collectives™ on Stack Overflow

Angular JS code is not working

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related