首页 > 解决方案 > angular.js ng-repeat does not seem to be working

问题描述

I am using angular.js version 1.7.2 I have the following code

html

<div class="container" ng-app="booksApp"  ng-controller="booksController">
    <div class="starter-template">
        <h1>My Book Catalogue</h1>
         <table class="table">
            <thead>
                <tr><th>Title</th><th>Author</th><th>Year</th><th>Language</th></tr>
            </thead>
            <tbody>
                <tr ng-repeat="book in books">
                     <td>{{ book.title }}</td>
                     <td>{{ book.author }}</td>
                     <td>{{ book.year }}</td>
                     <td>{{ book.language }}</td> 
                </tr>
            </tbody>
        </table> 


    </div>
</div>

In my app.js, I have the following:

books = [{'title': 'Finnegans Wake', 'author': 'Janes Joyce', 'language': 'English', 'Year': '1941'},
         {'title': 'Don Quixote', 'author': 'Miguel De Cervantes', 'language': 'Spanish', 'Year': '1615'}
];
angular.module('booksControllers',[]).
            controller('booksController', function($scope){
   $scope.books = books;  
}
})
var booksApp = angular.module('booksApp',[
            'booksControllers',
            'ui.filters'
        ]);

The books array has 2 objects. ng-repeat is iterated twice, however the value is blank. {{book.title }} and other books elements have blank value.

Am I missing something?

标签: angularjsangularjs-ng-repeat

解决方案


我实际上是在使用编写代码而不是插入一个 html 文件,而是一个.twig文件。我发现我可以通过使用来防止树枝处理块

{% verbatim %}
{% endverbatim %}

我添加了这个,现在 angular.js 可以按预期工作。很抱歉我没有准确地提到这个问题。


推荐阅读