可以在ng-content出现在DOM中之前对其进行编辑吗?

时间:2019-02-04 19:24:17

标签: angular

给出这样的组件:

import { Component, ElementRef, AfterContentInit, ContentChild } from "@angular/core";

@Component({
  selector: "app-link",
  template: `
    <a href="#">
      <ng-content></ng-content>
    </a>
  `,
})
export class LinkComponent implements AfterContentInit {
  @ContentChild(LinkComponent, {read: ElementRef}) contentChild: ElementRef;

  ngAfterContentInit() {
    console.log(this.contentChild.nativeElement.childNodes[0].childNodes[0]);
  }
}

以及该组件的用法如下:

<app-link>
  This is a text link.
</app-link>

使用此代码,控制台将记录#text " This is a text link. "。我想修剪前后有多余的空格。

我是否有可能在浏览器中看到<ng-content>并对其进行操作/将其插入使用该组件的HTML的DOM中?

我本来以为AfterContentInitAfterViewInit之间的区别将提供答案,但是经过进一步的研究和测试,我认为并非如此。我知道可以通过执行<app-link>This is a text link.</app-link>来避免这种情况,但是尝试这样做的目的是使这种区别变得不必要。

0 个答案:

没有答案