javascript - 如何以 Angular 构建摘录功能

Question

我正在 AngularJS + RoR 中为后端创建小型博客系统。

我的数据库中存储了一个帖子，帖子的内容存储在“内容”列中。内容列数据的示例是这样的。

<p>Hello how are you doing?</p><p>how about you?</p>

我想在主页上显示我的所有博客文章，就像新闻源一样。当然我不想显示每篇文章的全部内容。假设我只想显示帖子内容的前 100 个字符。

到目前为止，我设法从通过自定义过滤器显示的字符串中 trim html 标签

angular.module('flapperNews').
  filter('htmlToPlaintext', function() {
    return function(text) {
      return  text ? String(text).replace(/<[^>]+>/gm, '') : '';
    };
  }
);

它的用法如下:

<div ng-bind-html="post.content | htmlToPlaintext"></div>

但是输出看起来像这样

Hello how are you doing?how about you?

正如您可能注意到的那样，现在句子之间没有空格。

有什么方法可以解决这个问题，或者您是否知道如何向 Angular 应用程序添加摘录功能的任何其他方法。

感谢任何帮助。

Answer 1

不要用 '' 替换标签，而是用空格替换:

angular.module('flapperNews').
  filter('htmlToPlaintext', function() {
    return function(text) {
      return text ? String(text).replace(/<[^>]+>/gm, ' ') : ''; // replace with a space
    };
  }
);