Remove html tags from content - ajax call AngularJs

[prem Kumar]

Hi,

I am new AngularJS. Need to get html content through ajax call in agulurJS.

When trying to display the result in table, it also displaying the tag with class name..

Here is my example,

<table>
<tr>
    <th>Name</th>
    <th>City</th>
    <th>Country</th>
</tr>
<tr ng-repeat="x in names">
<td>{{x.Name}}</td>
<td>{{x.City | uppercase}}</td>
<td>{{x.Country}}</td>
</tr>
</table>
<script type="text/javascript">

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

app.controller('myController',function($scope,$http){

$http.get("response.php").success(function(response) {
    $scope.names = response;
});
});
</script>

Response.php:
<?php

$arr = array(array('Name'=>'<span class="sample">test</span>','City'=>'test','Country'=>'test'));

echo json_encode($arr);
?>


Thanks.

[Anton Trapp]

Haven't tried it, but first guess: security problem.

Try to use ng-bind-html.

[prem Kumar]

Hi Anton Trapp,

thanks for your reply.. I have used ng-bind-html to display html content and it is working fine...

<td ng-bind-html="display_html_content(x.Name)">
</td>

$scope.display_html_content = function(snippet) {
  return $sce.trustAsHtml(snippet);
};