Why is the AngularJS expression not being displayed on the page?

Y

Yurii Nekrasov2016-06-01 17:22:46

Angular

Yurii Nekrasov, 2016-06-01 17:22:46

Hello. I started learning AngularJS on campus.codeschool.com and immediately ran into a problem. When I try to display an expression
<h1> {{store.product.name}} </h1>
on the page, I get it on the page - {{store.product.name}}
It seems that I did everything as in the example, but the name is not pulled from the js file.
What could be the problem?
Whole code:

<!DOCTYPE html>
<html lang="en" ng-app="store">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="js/app.js"></script>
    <script type="text/javascript" src="js/angular.min.js"></script>
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">

    <title>Angular Learning</title>
</head>
<body>
    <div ng-controller="StoreController as store">
        <h1> {{store.product.name}} </h1>
        <h2> ${{store.product.price}} </h2>
        <p> {{store.product.description}} </p>
    </div>
</body>
</html>

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

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

    var gem = {
        name: 'Dodecahedron',
        price: 2.95,
        description: '. . .',
    }
})();