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:
Aucun commentaire:
Enregistrer un commentaire