AngularJSを始めたのでその辺りの記事もちらほらと。
ということでまずはHTMLをエスケープせずに表示する方法。
例えばブログのタグリストにいい感じにリンク付けて表示するぜ!みたいな場合は、
var mainCtrl = function($scope, $http, $sce) { $scope.getTagLink = function(tags) { var txt = "タグ:"; for (var i = 0; i < tags.length; i ++) { txt += '<a href="" class="tag">'; txt += tags[i]; txt += '</a>'; } return $sce.trustAsHtml(txt); } }
app.jsファイル側のコントローラに$sceを読み込んで、$sce.trustAsHtml(表示したいテキスト)してください。
HTML側は、
<article ng-show="blogs.length" ng-repeat="blog in blogs" id="{{blog.id}}"> <p ng-bind-html="getTagLink(blog.tags)" class="blog-tags"></p> </article> <p ng-hide="blogs.length" class="caution">検索中…さもなくばデータあれへん</p>
といった感じで。
参考はこちら
How do you use $sce.trustAsHtml(string) to replicate ng-bind-html-unsafe in Angular 1.2+
以前はapp.js側でわざわざ処理しなくても、HTML側で「ng-bind-html-unsafe」で記載すれば良かったっぽいのが変わった感じですかね?
そんなこんな。