Em Ae Em Ae - 1 year ago 65
AngularJS Question

Can't find angularJS libs

I am new to front end development and learning angularJS. I have following folder structure

├── angular.min.js
├── app.js
├── bootstrap.min.css
└── index.html

And here is my

<!DOCTYPE html>
<html ng-app="gemStore">

<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"></script>

<body ng-controller="StoreController as store">
<div class="product row" ng-hide="store.product.soldOut">
<em class="pull-right">${{store.product.price}}</em>
<button ng-show="store.product.canPurchase">Add to cart</button>


and my
file is

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

app.controller('StoreController', function(){
this.products = gem;

var gem = [{
name: 'Azurite',
price: 2.95,
canPurchase: false,
soldOut: true;
}, {
name: 'Azurite 2',
price: 2.95,
canPurchase: false,
soldOut: true,

When i open this index.html page on chrome, I don't see
directives being replaced by real value. I haven't hosted this file on any server. As per my understanding, for html, i can just keep all the resources in relative path and the
file could see them. then why not here
is able to resolve it ?

Here is my
output when i open it on chrome

enter image description here

Answer Source

You just forgot to include the ngApp directive, as below:

angular.module('app', [])

<html ng-app="app">