Brent Nicolet
Brent Nicolet

Reputation: 345

Angular JS code is not working

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}}

Upvotes: 0

Views: 45

Answers (2)

Ashwin Ramaswami
Ashwin Ramaswami

Reputation: 913

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.

Upvotes: 0

Sajeetharan
Sajeetharan

Reputation: 222582

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

Upvotes: 1

Related Questions