私は今日AngularJSを学び始め、今のところ順調に進んでいます。しかし、問題が発生し、答えが見つからないようです。私がやろうとしているのは<p>Text</p>
、フォーマットされたとおりにhtml文字列を出力することですText
。これまでのところ、Angularはそれをプレーンとして印刷し<p>Text</p>
ます。
私のコードは次のとおりです。
JS
var blogApp = angular.module('blogApp', []);
blogApp.controller('blogPostsCtrl', function($scope, $http) {
$http.get('wp-json/posts').success(function(data) {
$scope.posts = data;
$scope.postsLoaded = 'visible-lg';
});
});
HTML
<article id="post-{{post.ID}}" <?php post_class(); ?> itemscope itemprop="blogPost" itemtype="http://schema.org/BlogPosting" ng-repeat="post in posts" ng-class="postsLoaded">
<h2 class="entry-title" itemprop="headline"><a title="Link do {{post.title}}" rel="bookmark" href="{{post.link}}">{{post.title}}</a></h2>
<div class="entry-content">
<img ng-src="{{post.featured_image.source}}">
{{post.content}}
</div>
<footer class="entry-footer">
<ul class="categories"><li ng-repeat="category in post.terms.category"><a href="{{category.link}}">{{category.name}}</a></li></ul>
</footer>
</article>
私の問題は{{post.content}}
です。試してみたかったのng-bind-unsafe
ですが、削除されました。私も試しましたng-bind-html="post.content"
が、うまくいきませんでした。
私はAngular1.4を使用しています。
あなたが探しているngBindHtml
。たとえば、コンテンツでは次のように使用します。
<div ng-bind-html="post.content"></div>
式を評価し、結果のHTMLを安全な方法で要素に挿入します。デフォルトでは、結果のHTMLコンテンツは$ sanitizeサービスを使用してサニタイズされます。この機能を利用するには、たとえば、モジュールの依存関係(コアAngularではない)にngSanitizeを含めることにより、$ sanitizeが使用可能であることを確認します。モジュールの依存関係でngSanitizeを使用するには、アプリケーションに「angular-sanitize.js」を含める必要があります。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加