CODEWITHSUNDEEP
angularjs
Davide Sirchia
Davide Sirchia

Reputation: 9

angularjs doesn't work in my code

hi everyone i can't understand why my easy code doesn't work

index.html : 

<!DOCTYPE html>
<html ng-app="store">
   <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"></script>
   </head>
   <body>
      <div ng-controller="StoreController as store">
         <h1> {{store.prodotto.name}} </h1>
         <h2> {{store.prodott.surname}} </h2>
         <p> {{store.prodotto.town}} </p>
      </div>
   </body>
</html>

app.js:

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

 app.controller('StoreController', function(){
 this.product = prodotto;
 });

 var prodotto  = {
     name = 'David',
     surname = 'Gilmour',
     town = 'Cambridge',
     }


 })();

both file are in the same folder with "angular.min.js" and "bootstrap.min.js" .

can anyone help me? thanks very much.

Upvotes: 0

Views: 77

Answers (1)

Jossef Harush Kadouri
Jossef Harush Kadouri

Reputation: 34207

Working Demo - https://plnkr.co/edit/94hthisj8Psc4Sp13dB1?p=preview

You have some syntax errors in your javascript;

instead of

 var prodotto  = {
     name = 'David',
     surname = 'Gilmour',
     town = 'Cambridge',
     }

use

 var prodotto  = {
     name : 'David',
     surname : 'Gilmour',
     town : 'Cambridge'
     };

In addition, seems you bounded to the wrong variable name

instead of

 <div ng-controller="StoreController as store">
         <h1> {{store.prodotto.name}} </h1>
         <h2> {{store.prodott.surname}} </h2>
         <p> {{store.prodotto.town}} </p>
 </div>

use

 <div ng-controller="StoreController as store">
         <h1> {{store.product.name}} </h1>
         <h2> {{store.product.surname}} </h2>
         <p> {{store.product.town}} </p>
 </div>

https://plnkr.co/edit/94hthisj8Psc4Sp13dB1?p=preview

Upvotes: 4

Related Questions