Question

我正在使用Angular呈现一些HTML内容：

<p class="description" ng-model="listing.Description"></p>

当它呈现内容时，它会在文本中显示图像，这很好。

现在，我想找到<img>代码并删除其中的内容，因此它只会呈现文字。

例如：

<p>Hi this is Peter</p>
<img src=jfj"></img>    <!--------- This line should be removed -->
<span>Span 4 </span>

我该怎么做？

Answer 1

您可以使用过滤器和一些正则表达式来删除<img>标记。下面的示例依赖于打开和关闭标记。

angular.module('app', [])
  .filter('removeImg', function($sce) {
    return function(input) {
      return $sce.trustAsHtml(input.replace(/\<img.*img\>/gi, ''));
    }
  })
  .controller('DemoCtrl', function() {
    var _this = this;
    _this.listing = {
      Description: '<p>Hi this is Peter</p><img src=jfj"></img><span>Span 4 </span>'
    };
  });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"></script>
<div ng-app="app" ng-controller="DemoCtrl as dc">
  <p class="description" ng-bind-html="dc.listing.Description | removeImg"></p>
</div>

在角度模型属性中解析<img/>标记

1 个答案: