HTML换行符使用 <br> 标记 <p> 标签

Question

在我的HTML中，我正在使用

显示一些文本，如下所示：

 <p> {{item.bio}} </p>

这是生物物体的样本：

 "bio": "A<br>B<br>C<br>D<br>E<br>F"

我原本希望每个字母都放在单独的行中，但是最糟糕的是，当我运行HTML时，向我显示使用<br>标记编写的文本。

Answer 1

为了在ionic V1中插入html，您应该使用ng-bind-html指令：

 <div ng-bind-html="item.bio"></div>

对于第二个版本

<div [innerHTML]="item.bio"></div>

Answer 2

计算表达式并将生成的HTML以安全的方式插入到元素中。 在模块的依赖项中使用ngSanitize 。

您的代码我们想要：

<p ng-bind-html="item.bio"></p>

有关更多详细信息，请单击此处 。

Answer 3

使用消毒

 angular.module('sanitizeExample', ['ngSanitize'])
           .controller('ExampleController', ['$scope', '$sce', function($scope, $sce) {
             $scope.snippet =
               '<p style="color:blue">an html\n' +
               '<em onmouseover="this.textContent=\'PWN3D!\'">click here</em>\n' +
               'snippet</p>';
             $scope.deliberatelyTrustDangerousSnippet = function() {
               return $sce.trustAsHtml($scope.snippet);
             };
           }]);