角度視圖顯示錯誤結果

我在Codecademy的一個Angular課程中遇到了嚴重問題。我不確定在運行Codecademy的程序中是否存在錯誤，或者我的代碼中是否有錯誤。我應該看到這個H1的標題，本月的暢銷書除了所有圖書的圖像。然而，我卻看到了這個結果：{{title}}伴隨此消息：**「哎呀！測試返回了一個錯誤，也許你有語法錯誤或錯字錯誤，爲什麼我看到{{title}}，？這是HTML代碼，屏幕上顯示我似乎無法找出爲什麼角度視圖顯示錯誤結果

這是html：

<!doctype html> 
<html> 
    <head> 
     <link href="http://s3.amazonaws.com/codecademy-content/projects/bootstrap.min.css" rel="stylesheet" /> 
    <link href='http://fonts.googleapis.com/css?family=Roboto:500,300,700,400' rel='stylesheet' type='text/css'> 
    <link href="css/main.css" rel="stylesheet" /> 

    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.5/angular.min.js"></script> 
    </head> 
    <body ng-app="myApp"> 
    <div class="header"> 
     <div class="container"> 
     <h1>Book End</h1> 
     </div> 
    </div> 

    <div class="main" ng-controller="MainController"> 
     <div class="container"> 

     <h1>{{ title }}</h1> 
     <h2>{{ promo }}</h2> 

     <div ng-repeat="product in products" class="col-md-6"> 
       <div class="thumbnail"> 
        <img ng-src="{{ product.cover }}"> 
        <p class="title">{{ product.name }}</p> 
        <p class="price">{{ product.price | currency }}</p> 
        <p class="date">{{ product.pubdate | date }}</p> 
       </div> 
       </div> 

     </div> 
    </div> 

    <div class="footer"> 
     <div class="container"> 
     <h2>Available for iPhone and Android.</h2> 
     <img src="http://s3.amazonaws.com/codecademy-content/projects/shutterbugg/app-store.png" width="120px" /> 
     <img src="http://s3.amazonaws.com/codecademy-content/projects/shutterbugg/google-play.png" width="110px" /> 
     </div> 
    </div> 


    <!-- Modules --> 
    <script src="js/app.js"></script> 

    <!-- Controllers --> 
    <script src="js/controllers/MainController.js"></script> 
    </body> 
</html>

這是JavaScript（MainController.js）：

app.controller('MainController', ['$scope', function($scope) { 
    $scope.title = 'This Month\'s Bestsellers'; 
    $scope.promo = 'The most popular books this month.'; 
    $scope.products = [ 
    { 
     name: 'The Book of Trees', 
     price: 19, 
     pubdate: new Date('2014', '03', '08'), 
     cover: 'img/the-book-of-trees.jpg' 
    }, 
    { 
     name: 'Program or be Programmed', 
     price: 8, 
     pubdate: new Date('2013', '08', '01'), 
     cover: 'img/program-or-be-programmed.jpg' 
    }, 
    **{ 
    name: 'One Simple Idea', 
    price: 22, 
    pubdate: new Date('2011', '02' '18'), 
    cover: "https://s1.postimg.org/36xiodlmzz/Key-1259589676_3_D.jpg" 
    }, 
{ 
    name: 'Sell Your Idea with or without a Patent', 
    price: 22, 
    pubdate: new Date('2015', '03','03'), 
    cover:"https://s1.postimg.org/4vjmzpyxa7/stephen-key-book.jpg" 
    }, 
     ] 
}]);

這是我添加的代碼：

{ 
    name: 'One Simple Idea', 
    price: 22, 
    pubdate: new Date('2011', '02' '18'), 
    cover: "https://s1.postimg.org/36xiodlmzz/Key-1259589676_3_D.jpg" 
    }, 
{ 
    name: 'Sell Your Idea with or without a Patent', 
    price: 22, 
    pubdate: new Date('2015', '03','03'), 
    cover:"https://s1.postimg.org/4vjmzpyxa7/stephen-key-book.jpg" 
    },

此代碼是完全一樣的語法立即之前它的代碼。但是，當我刪除我放入的代碼並保留原始代碼時，一切正常。 查看和比較圖片。

Screenshot of result of my additional code

Screenshot of result without my code included

來源

2017-10-20 codebwoy

**你的JSON對象是什麼？ – Zooly

你可以做F12並檢查開發者控制檯是否有錯誤？ OMG！ –