membersound membersound - 5 months ago 9
AngularJS Question

How to display a repeated list with angularjs and html formatting?

I want to show a repeated list, and render each element with

ngSanitize
as follows:

<div ng-repeat="todo in todos" ng-bind-html="todo.text"/>


I get no error in the console, but I also don't get any output. Why?

By the way: the following does actually work, but unformatted markup:

<div ng-repeat="todo in todos">{{todo.text}}</div>

ABr ABr
Answer

I think there were a few mistakes in your code. The example below should help you further. Remember, Angular doesn't support self closing <div>-tags.

HTML

<div ng-app="myApp" ng-controller="myAppCtrl">
    <div ng-repeat="todo in totos" ng-bind="todo.text"></div>
</div>

JS

angular.module("myApp", [])
.controller("myAppCtrl", function($scope) {
    $scope.todos = [
        {name: "todo1", text: "This is test todo 1"},
        {name: "todo2", text: "This is test todo 2"},
        {name: "todo3", text: "This is test todo 3"}
    ]
});

JSFiddle: https://jsfiddle.net/ABr/38foxe31/