ng-repeat不輸出數組結果

我在這方面還是比較新的，但是我遇到問題讓我的ng-repeat輸出book.review和book.stars。任何人都可以指出什麼是錯的？即使我把東西像只是一個字的NG-重複例如像ng-repeat不輸出數組結果

的測試字

測試字從來沒有呈現在屏幕上。

的index.html

<!DOCTYPE html> 
<html ng-app="DirectivesTest"> 
    <head> 
     <title>Directives Practice</title> 
     <link rel="stylesheet" href="app.css"> 
     <script src="bower_components/angular/angular.js"></script> 
     <script src="app.js"></script> 
    </head> 
    <body> 
     <div id="header"> 
      The #1 Book Review Site With Only 6 Books! 
     </div> 
     <div class="container"> 
      <div class="row"> 
       <div class="col-md-4"> 
        <div ng-controller="BookController"> 
         <div class="test" ng-repeat="book in books"> 
          {{book.review}} 

          {{book.stars}} 
         </div> 
        </div>  
       </div> 
      </div> 
     </div> 
     <book-reviews></book-reviews> 
    </body> 
</html>

app.js

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

app.directive('bookReviews', function(){ 
    return { 
     restrict: 'E', 
     templateUrl: 'book-reviews.html', 
     controller: 'BookController' //controller function 
    }; //end return 
}) //end directive 

app.controller("BookController", [ '$scope', function($scope){ 
    $scope.books = [{ 
     $scope.title: "Harry Potter and the Sorcerer's Stone", 
     $scope.description: "Harry Potter has no idea how famoushe is. That's because he's being raised by his miserable aunt and uncle who are terrified Harry will learn that he's really a wizard, just as his parents were. But everything changes when Harry is summoned to attend an infamous school for wizards, and he begins to discover some clues about his illustrious birthright. From the surprising way he is greeted by a lovable giant, to the unique curriculum and colorful faculty at his unusual school, Harry finds himself drawn deep inside a mystical world he never knew existed and closer to his own noble destiny.", 
     $scope.review: [ 
      { 
       $scope.stars: 5, 
       $scope.body: "I love this book!", 
       $scope.author: "[email protected]", 
       $scope.createdOn: 42434343 
      }, 
      { 
       $scope.stars: 4, 
       $scope.body: "It was pretty good. A little long though", 
       $scope.author: "[email protected]", 
       $scope.createdOn: 42434343 
      }, 
      { 
       $scope.stars: 5, 
       $scope.body: "It's the best book I've ever read.", 
       $scope.author: "[email protected]", 
       $scope.reatedOn: 454535543 
      } 
     ] 
    }]; 

}])

來源

2016-08-04 user6680

你需要存儲'在'$ scope' books'，如果你想從我更新視圖 – rob

你必須使用$範圍提供控制器和視圖之間的綁定。

你的情況：

... 
app.controller("BookController", function($scope){ 
$scope.books = [{ 
...

來源

2016-08-04 20:51:27 tpsilva

訪問代碼來反映上面的變化。我幾乎擁有它。我現在說它{{book.review}} {{book.stars}}，而不是沒有，所以這是進步，但它仍然沒有拉動變量。有任何想法嗎？ – user6680

控制檯沒有錯誤發生？ – tpsilva

從book對象的屬性中刪除$ scope，只有書籍的範圍。 – tpsilva

正如上面提到的，你需要把書本上的$範圍。你也可以在第一個評論裏面設置另一個ng-repeat。

<div ng-repeat="review in book.review">

然後打印每次審查的明星使用

{{review.stars}}

在問候你最後的編輯，唯一的書需要放在範圍。而不是對象內部的變量。

$scope.books = [{ 
     title: "Harry Potter and the Sorcerer's Stone", 
     description: "Harry Potter has no idea how famoushe is. That's because he's being raised by his miserable aunt and uncle who are terrified Harry will learn that he's really a wizard, just as his parents were. But everything changes when Harry is summoned to attend an infamous school for wizards, and he begins to discover some clues about his illustrious birthright. From the surprising way he is greeted by a lovable giant, to the unique curriculum and colorful faculty at his unusual school, Harry finds himself drawn deep inside a mystical world he never knew existed and closer to his own noble destiny.", 

     review: [{ 
      stars: 5, 
      body: "I love this book!", 
      author: "[email protected]", 
      createdOn: 42434343 
}, 
{ 
    stars: 4, 
    body: "It was pretty good. A little long though", 
    author: "[email protected]", 
    createdOn: 42434343 
}, 
{ 
    stars: 5, 
    body: "It's the best book I've ever read.", 
    author: "[email protected]", 
    reatedOn: 454535543 

} 
] 
     }];

來源

2016-08-04 20:57:23 Evan

這應該爲你工作：

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

 
app.controller("BookController", function($scope){ 
 
$scope.books = [{ 
 
    title: "Harry Potter and the Sorcerer's Stone", 
 
    description: "Harry Potter has no idea how famoushe is. That's because he's being raised by his miserable aunt and uncle who are terrified Harry will learn that he's really a wizard, just as his parents were. But everything changes when Harry is summoned to attend an infamous school for wizards, and he begins to discover some clues about his illustrious birthright. From the surprising way he is greeted by a lovable giant, to the unique curriculum and colorful faculty at his unusual school, Harry finds himself drawn deep inside a mystical world he never knew existed and closer to his own noble destiny.", 
 
    review: [{ 
 
     stars: 5, 
 
     body: "I love this book!", 
 
     author: "[email protected]", 
 
     createdOn: 42434343 
 
    }, 
 
    { 
 
     stars: 4, 
 
     body: "It was pretty good. A little long though", 
 
     author: "[email protected]", 
 
     createdOn: 42434343 
 
    }, 
 
    { 
 
     stars: 5, 
 
     body: "It's the best book I've ever read.", 
 
     author: "[email protected]", 
 
     createdOn: 454535543 
 
    }] 
 
}]; 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script> 
 

 
<div ng-controller="BookController" ng-cloak="" ng-app="MyApp"> 
 
    <div class="test" ng-repeat="book in books"> 
 
     <h4>{{book.title}}</h4> 
 
     {{book.description}} 
 
     <div ng-repeat="review in book.review"> 
 
      <hr/> 
 
      Stars: {{review.stars}}, {{review.body}} 
 
     </div> 
 
    </div> 
 
</div>

來源

2016-08-04 21:00:06 Antipod

ng-repeat不輸出數組結果

回答

相關問題