javascript - ng-bind-html 获取html内容的首字母

Question

我遇到的情况是使用 ng-bind-html 进行 html 绑定(bind)。我想获取 html 内容的第一个字符(不包括 html 标签)。下面是我的示例代码。

<span class="first-letter">{{firstLetter}}</span>
            <div id="myDiv" ng-CLoak data-ng-bind-html="trustAsHtml(data.ContentDescription)" class="{{currentFont}}"></div>

我的 html 字符串如下所示

<p><span>hii my content</span></p>
the starting and ending tags are un predictable.

我想要第一个字母“h”而不是“<”提前致谢。

Answer 1

您可以使用 textContent 属性让浏览器为您剥离 html

function strip(html)
{
   var tmp = document.createElement("DIV");
   tmp.innerHTML = html;
   return tmp.textContent || tmp.innerText || "";
}

由于您只对第一个字母感兴趣，因此您可能不需要 ng-bind-html :)

如果您想突出显示第一个字母，请使用 CSS :first-letter https://developer.mozilla.org/en-US/docs/Web/CSS/%3A%3Afirst-letter