AngularJS rendering html tag as string - angularjs

Question

There is <ul> <li>..</li> </ul> tag which contains a product description.
I used ngSanitize dependency but it did not work. I also tried ng-bind-html, $sce.trustAsHtml() but it is not working. Result is rendering the tag itself as string like <ul><li>something</li></ul>
I am using angular 1.4.
On browser console it is printing like:
<ul><li>Experience subject to availablity</li>
And on HTML page it is printing like:
<ul> <li> Experience subject to availablity</li>......
First I tried sanitize dependacy with html-bind-unsafe
var app = angular.module('frogo-app', ['ngAnimate', 'ui.bootstrap','ngRoute', 'ngSanitize']);
app.controller('contactController', function($scope, $http, myservice) {
$scope.ysk = data from server;
......
}
HTML
<div ng-bind-html="ysk"></div>
Secondly I tried
app.controller('contactController', function($scope, $http, $sce, myservice) {
$scope.ysk =$sce.trustAsHtml($scope.you_should_know);
......
}
HTML
<div ng-bind-html="ysk"></div>
Third I tried
app.filter('unsafe', function($sce) { return $sce.trustAsHtml;});
HTML
<div ng-bind-html="ysk | unsafe"></div>

Answer 1

I use this filter :
/**
* to interpret html code in the view ( otherwise it display the code without interpret it )
*
* usage : <span ng-bind-html="value | unsafe"></span>
*/
var interfaceApp = angular.module('interfaceApp', []);
interfaceApp.filter('unsafe', function ($sce) {
return function (val) {
return $sce.trustAsHtml(val);
};
});
and call it the html view like this :
<span ng-bind-html="value | unsafe"> </span>
value is the data you want to disply contenaing html tag

Answer 2

I could be totally wrong but it sounds like you are trying to evaluate a string containing HTML from a database query and render it as html...
You would want to do something like this:
In your template:
<div ng-controller="MyCtrl">
Hello, {{name}}!
<div ng-bind-html="my_html | to_trusted"></div>
</div>
And in your js/controller:
var myApp = angular.module('myApp',[]);
angular.module('myApp')
.filter('to_trusted', ['$sce', function($sce){
return function(text) {
return $sce.trustAsHtml(text);
};
}]);
function MyCtrl($scope) {
$scope.name = 'Superhero';
$scope.my_html = '<label><b>Hello </b> <input type="text" value="world !"> </label>';
}
Some from your pseudo-code above with $scope.ysk you would use something like this in your template:
<li><span ng-bind-html="ysk | to_trusted"></span></li>