我想了解到底是什么原因导致AfterViewInit()和AfterContentInit()生命周期挂钩火.
来自官方角度文档,它说为AfterViewInit()
角色调用后会创建组件的子视图
Angular将Angular项目外部内容投入到组件中后进行Angular调用
这两个陈述似乎对我来说几乎无法区分.儿童观点与外部内容不一样吗?
例如: parent.component.html
<div class="parent">
<child-comp></child-comp>
</div>
Run Code Online (Sandbox Code Playgroud)
其中child-comp是包含大量标记并依赖于异步数据的子组件.
在parent.component.ts中,我想等到子组件完全呈现后再调用AfterViewInit()或AfterContentInit().当我运行这个代码时,它会按照确切的顺序发生,Angular会AfterContentInit()先调用它,然后再调用它 AfterViewInit().目前,child-comp没有接收到大量数据,但最终它可以并且渲染需要更长时间(数据将在实时生长).
我现在担心的是因为我的数据是有限的,并且加载时间如此之快,通过选择一个生命周期钩子而不是另一个我可能不情愿地最终处于竞争状态 - 一旦数据增加并且加载时间减速就会失败.
在 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();
Run Code Online (Sandbox Code Playgroud)
Angular 中是否有替代方法来实现这一点,或者是否有一些新的既定模式可以做到这一点?
angular ×2