CODEWITHSUNDEEP
angularjshtml
John
John

Reputation: 1220

Simple Angular JS application not showing up on browser

I created two pages index.html and app.js(Basically following the tutorial from here) , the contents of each of them are as follows:

index.html

<!DOCTYPE html>
<html ng-app ="store">
    <head>
      <link rel = "stylesheet" type="text/css" href="bootstrap/bootstrap.min.js"/>
    </head>

    <body>
       <div ng-controller="StoreController as store">
          <h1> {{store.product.name}} </h1>
          <h2> ${{store.product.price}} </h2>
          <p> {{store.product.description}} </p>
          <button ng-show ="store.product.canPurchase"> Add to cart </button>
       </div>



       <script type="text/javascript" src="angular-1.3.14/angular.min.js"></script>
       <script type="text/javascript" src="app.js"></script>

    </body>




</html>

app.js

(function(){)
var app = angular.module('store',[]);
app.controller('StoreController',function() {
    this.product = gem;

});
var gem = {

    name: 'Dodecahedron',
    price: 2.95,
    description:'. . .',
    canPurchase: false
}
})();

For some reason, it's not actually printing the values on the web browser, here is what I am getting:

enter image description here

Upvotes: 2

Views: 2282

Answers (2)

Khushaar Tanveer
Khushaar Tanveer

Reputation: 3

Javascript 

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

app.controller('StoreController', function() {
var gems = [{
    name: 'Diamond',
    price: 100,
    description: 'Shiny',
    canPurchase: true,
    soldOut: false
},
    {
        name: 'Sapphire',
        price: 200,
        description: 'Shiny',
        canPurchase: true,
        soldOut: false
    }

];

this.products = gems;
});

i had the same problem this works

Upvotes: 0

squiroid
squiroid

Reputation: 14017

Syntax error remove ")" 

(function(){
var app = angular.module('store',[]);
app.controller('StoreController',function() {
    this.product = gem;

});
var gem = {

    name: 'Dodecahedron',
    price: 2.95,
    description:'. . .',
    canPurchase: false
}
})();

Plunker

Upvotes: 1

Related Questions