Why my Angular JS app is not working?

Question

Here is firstAngularJSApp.html

<html ng-app="store"><!-- "ng-app" creates and angular app by running the module. because of ng-app html inside of this tag will be treated as part of angular app --> 
<head>
    <link rel="stylesheet" type="text/css" href="bootstrap.min.css"/>
    <script type="text/javascript" src="angular.min.js"></script>
    <script type="text/javascript" src="app.js"/>
</head>
<body>

<p>I am {{ 4+6 }}</p>

</body>
</html>

Here is app.js

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

When I load the page I don't get "I am 10" rather it's blank page. But when I open the source code using Ctrl+U I can see "<p>I am {{ 4+6 }}</p>"

I am using XAMMP to access my files.

Path is correct, self closing script tag was causing problem as mentioned by @Tushar — user4904589, Sep 16 '15 at 07:50

score 4 · Accepted Answer · edited May 23 '17 at 11:58

4

You're using the self-closing script tag which will not work. See Why don't self-closing script tags work?

So, your app.js file is not included on the page and your angular app is not bootstrapped.

Use

<script type="text/javascript" src="app.js"></script>

Also, make sure the file paths are correct.

edited May 23 '17 at 11:58

Community

1
1

answered Sep 16 '15 at 07:44

Tushar

85,780
21
159
179

score 0 · Answer 2 · answered Sep 16 '15 at 07:48

0

seems like your angular framework is not loaded to the page. make sure it is loaded correctly and check the paths. if you want you can use the network tab in developer tools to check that.

answered Sep 16 '15 at 07:48

tech-gayan

1,373
1
10
25

score 0 · Answer 3 · answered Sep 16 '15 at 08:19

Your app.js will not load by this method of self closing tags because it is usually intended to contain some piece of code inside it. This prevents your module from being loaded hence your angular app is not working.

use

<script src="app.js"></script>

All the best!!!

Why my Angular JS app is not working?

3 Answers3