angular $sanitize vs. ng-bind-html

Question

I am using angular's ng-bind-html to bind this text to page:

Ale
skoro nikdy sa nepozeráme na priemerné produkty s údivom, že nie sú skvelé.
Priemerné služby a produkty robia to, čo sa od nich očakáva. Nastavili ale
latku tak nízko, že skoro ani nemá cenu urobiť kvôli ním pár krokov navyše, aby
ste si ich kúpili.<div><br></div><div><br></div><div>Prečo
nie je každé jedlo v reštaurácii skvelou kúpou za svoju cenu? Vyzerá to, ako by
sme ochotne brali všetko viac menej zlé za prijateľné, s výnimkou prípadov, keď
daný produkt, služba alebo firma nestoja úplne za nič.</div><div><br></div><div><br></div><div>Vyzvite priemernosť vo
vašej firme na súboj.&nbsp;Pretože presne takýto pohľad priemernosti na vás, môžu
mať aj vaši zákazníci.</div>

so you can see it contains various html markups encoded characters. ng-data-bind handles this very correctly so the text is readable on the page.

However when I use $sanitize for this text to filter the html characters out, I'm getting this:

Ale&#10;skoro nikdy sa nepozer&#225;me na priemern&#233; produkty s &#250;divom, &#382;e nie s&#250; skvel&#233;.&#10;Priemern&#233; slu&#382;by a produkty robia to, &#269;o sa od nich o&#269;ak&#225;va. Nastavili ale&#10;latku tak n&#237;zko, &#382;e skoro ani nem&#225; cenu urobi&#357; kv&#244;li n&#237;m p&#225;r krokov navy&#353;e, aby&#10;ste si ich k&#250;pili.<div><br></div><div><br></div><div>Pre&#269;o&#10;nie je ka&#382;d&#233; jedlo v re&#353;taur&#225;cii skvelou k&#250;pou za svoju cenu? Vyzer&#225; to, ako by&#10;sme ochotne brali v&#353;etko viac menej zl&#233; za prijate&#318;n&#233;, s v&#253;nimkou pr&#237;padov, ke&#271;&#10;dan&#253; produkt, slu&#382;ba alebo firma nestoja &#250;plne za ni&#269;.</div><div><br></div><div><br></div><div>Vyzvite priemernos&#357; vo&#10;va&#353;ej firme na s&#250;boj.&#160;Preto&#382;e presne tak&#253;to poh&#318;ad priemernosti na v&#225;s, m&#244;&#382;u&#10;ma&#357; aj va&#353;i z&#225;kazn&#237;ci.</div>

so how can I mimic ng-bind-html inside my controller to clear the text and use it further?

EDIT: to me more clear, I don't need to bind this text to the view. This already works. I need to work with the text in controller's logic so I just need to clean it and use it further.

Answer 1

$sce.trustAsHtml() should be used.

HTML:

<td ng-bind-html="mData.data | unsafe"></td>

JS:

mOverview.controller('appController', function ($scope, $sce) {
  $scope.mData = [
    {
        'data': 'your data'
    }
    ];
});

mOverview.filter('unsafeFilter', function($sce) {
    return function(val) {
        return $sce.trustAsHtml(val);
    };
});