AfterContentInit, AfterContentChecked, OnDestroy钩子

最新推荐文章于 2023-05-09 14:34:51 发布

Phoenix_99

最新推荐文章于 2023-05-09 14:34:51 发布

阅读量173

点赞数

分类专栏： angular

本文链接：https://blog.csdn.net/Phoenix_99/article/details/109020713

版权

本文探讨Angular中组件的AfterContentInit和AfterContentChecked生命周期钩子，以及OnDestroy钩子。从app-routing模块到组件模板（HTML）和 TypeScript 实现，逐一解析这些钩子在不同阶段的作用，如何监听内容变化和在组件销毁时释放资源。

摘要由CSDN通过智能技术生成

app-routing TS

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {NextlinkComponent} from './nextlink/nextlink.component';
import {ChildComponent} from './child/child.component';

const routes: Routes = [
  {path: '', component: ChildComponent},
  {path: 'nextlink', component: NextlinkComponent},
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

app HTML

<div class="wrapper">
  <h2>我是父组件</h2>
  <div>这个div定义在父组件中</div>
  <app-child>
    <div class="header">这个div是父组件投影到子组件的1, {
  {title}}</div>
    <div class="footer">这个div是父组件投影到子组件的2</div>
  </app-child>
</div>
<div [innerHTML] =