AngularJS HTML標簽顯示

Question

我正在嘗試添加以下代碼。

$scope.journals = [
   {title: "Journal", content: "This is content <br>"}
]

我擁有的HTML是：

<div ng-repeat="journal in journals">
   <h1>{{journal.title}}</h1>
   <span>{{journal.content}}</span>
</div>

但是，“ br”標記僅顯示為純文本，而不顯示為html。 我該如何解決？

Answer 1

如果您不想惹$ sce，而只想完成er：

lrApp.directive('bindHtml', function () {
return {
    restrict: 'A',
    link: function (scope, elem, attrs) {
        scope.$watch(attrs.bindHtml,function(nv,ov){
            elem.html(nv);
        });
    }
};
});

Answer 2

不知道這是否適合您，但是您可以結合使用ng-bind-html和$sce.trustAsHtml()將內容標記為受信任。 請注意，只有在您可以真正認為內容安全時，才需要這樣做。

這里有一個小例子：

http://plnkr.co/edit/L51T4OxdF8AFF5lRQdQW

這是$sce文檔。 值得一讀的恕我直言，以了解trustAs的影響。

https://docs.angularjs.org/api/ng/service/ $ sce

Answer 3

您只需要使用由angularjs提供的ng-bind-html指令

<span ng-bind-html="journal.content"></span>