I am indulging with angularjs, there was a question with ng-repeat, and specifically with the html output inside the loop. In my case, this is s.body

<svg id="test" ng-controller="SvgList"> <symbol id="{{s.idItem}}" vbox="{{s.viewBox}}" ng-repeat="s in test" > {{s.body}} </symbol> 

 var app = angular.module('App', ['ngSanitize']); app.controller('SvgList', ['$scope', function($scope) { $scope.test = [{ idItem: 'triangle', viewBox: '0 0 20 20', body: '<path d="M 0,0 L 18,10 L 0,20z"></path>' }] }]);

here is a live example on plunker

I tried using ng-bind-html = "s.body", but the output is empty

versions used these

 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> <script src="https://code.angularjs.org/1.6.4/angular-sanitize.js"></script>

    1 answer 1

    solution found

      app.filter('trustAsHtml',['$sce', function($sce){ return function (text){ return $sce.trustAsHtml(text); }; }]);

    in html

     <symbol id="{{s.idItem}}" vbox="{{s.viewBox}}" ng-repeat="s in symbols" ng-bind-html="s.body|trustAsHtml"></symbol>