Question

所以我试图使用ng-repeat作为'博客'的东西，而我只是在控制台上看到一个没有错误的空白屏幕，我一直在玩它但是无法弄清楚是什么我做错了！有人可以帮忙吗？这是我的代码：

HTML

<link rel="stylesheet" type="text/css" href="style.css">
<script src="angular.min.js"></script>
<script src="blog.js"></script>
<div class="myBlog" ng-app="app" ng-controller="blogController" ng-repeat="post in posts track by $index">
<h3>{{post.title}}</h3>
<p>{{post.date}}</p>
<p>{{post.content}}</p>
</div>

blog.js

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

app.controller('blogController', function($scope) {

    $scope.posts = [
    {title:'Test Post',date:'5/10/16',content:'This is a test!'},
    {title:'Test Post 2',date:'5/10/16',content:'This is the second test!'}
    ];


});

如果这有帮助，当我在打开的页面上检查chrome中的元素时，我看到：

<!-- ngRepeat: post in posts track by $index -->

但仍然没有显示......

Answer 1

您需要在div之外移动应用程序和控制器调用，指定ng-repeat。

<div class="myBlog" ng-repeat="post in posts track by $index">
  <h3>{{post.title}}</h3>
  <p>{{post.date}}</p>
  <p>{{post.content}}</p>
</div>

看一下Plunker：http://plnkr.co/edit/gb4DgQFkvAsub4FLebbG?p=preview

通常，我想在ng-app标记中进行html调用。我还对包含相对于该控制器的所有代码的div元素进行ng-controller调用。

尝试使用ng-repeat时出现空白屏幕？

1 个答案: