Question

在AngularJS中，这很简单。我们可以使用angular.element().text()函数，该函数实际上仅使用jQuery .text()函数来：

获取匹配元素集合中每个元素的组合文本内容，包括它们的后代。

这正是我想在Angular（v6）中复制的内容，但是我一直无法在其文档中找到替换该功能的任何方法。另外，我真的很想避免仅为此一种用例加载jQuery。

在旧版AngularJS客户端中，我的代码如下：

// Note: This html is actually coming from a server
var html = `<div>
              <span>Record final amount added to productA </span>
              <input ...>
              <br>
              <span >ProductA</span>: <span> Max Capacity 2500 kg</span>
              <span> Continue process for sequence B </span>
            </div>`;

var allText = angular.element(html).text();

在Angular中是否有替代方法可以完成此任务，或者是否有一些新的确定的执行模式？

Answer 1

1。如果您想要来自DOM的innerText

为此使用@ViewChild

在要从中获取文本的div上添加模板变量。

<div #myDiv>This is the text in this div</div>

然后在您的组件类中，通过首先从@ViewChild导入变量，创建一个变量并使用@angular/core装饰器对其进行装饰。

@ViewChild('myDiv') myDiv: ElementRef;

这将为您生成内部文本。

ngAfterViewInit() {
  this.myDiv.nativeElement.innerText
}

2。如果您只想获取没有HTML标签的内部文本

在您的TypeScript中，只需使用此正则表达式：

html.replace(/<[^>]*>/g, '');

Angular：如何从所有元素及其后代中获取文本？

1 个答案: