Angular 在页面之间导航时未调用ngAfterViewInit

购物车页面

import{Component，OnDestroy，AfterViewInit，OnInit，AfterContentInit，ChangeDetectorRef，}从'@angular/core'导入；
从'@angular/Router'导入{Router，NavigationEnd，ActivatedRoute}
从“../data/storage.service”导入{StorageService}；
从“../data/data provider.service”导入{DataProviderService}；
从“lodash”导入*as uuu；
@组成部分({
选择器：“应用程序购物车”，
templateUrl:'./cart.page.html'，
样式URL:['./cart.page.scss']，
})
导出类CartPage实现AfterViewInit、AfterContentInit、OnDestroy和OnInit{
cartItems=[]；
总数=0；
构造函数（公共购物车：StorageService，私有cdRef:ChangeDetectorRef，公共数据提供者：DataProviderService，私有路由器：路由器，私有路由：ActivatedRoute）{
}
恩戈尼尼特（）{
log（“Init called”）
}
异步ngAfterViewInit（）{
log（“让我们检查！！”；
console.log（“\n\n\n\n这是init func”）；
}
}

详细信息页面

import{Component，OnInit，ondestory，AfterViewInit，ChangeDetectorRef，ChangeDetectionStrategy，AfterContentInit}从'@angular/core'导入；
从'@angular/router'导入{ActivatedRoute}；
从“../data/data provider.service”导入{DataProviderService}；
从“../data/utils.service”导入{UtilsService}；
从“../data/storage.service”导入{StorageService}；
从'@angular/Router'导入{Router，NavigationEnd}
从“lodash”导入*as uuu；
@组成部分({
选择器：“应用程序详细信息”，
templateUrl:'./details.page.html'，
样式URL:['./details.page.scss']，
})
导出类DetailsPage实现AfterViewInit、AfterContentInit和OnDestroy{
构造函数（私有路由：ActivatedRoute，私有cdRef:ChangeDetectorRef，公共数据提供者：DataProviderService，公共UTIL:UTILService，公共购物车：StorageService，私有路由器：路由器）{
}
ngAfterViewInit（）{
log（“详细信息页面视图初始化”）；
}
恩贡德斯特罗（）{
log（“我正在销毁详细信息！！”；
}
ngAfterContentInit（）{
console.log（“触发查看内容”）；
}

路由器模块

从'@angular/core'导入{NgModule}；
从'@angular/router'导入{Routes，RouterModule}；
常数路由：路由=[
{路径：''，重定向到：'home'，路径匹配：'full'}，
{path:'home'，loadChildren:'./home/home.module#HomePageModule'}，
{path:'details/:category/:id'，loadChildren:'./details/details.module#DetailsPageModule'，runguard和resolvers:'always'}，
{path:'products/：category'，loadChildren:'./products/products.module#ProductsPageModule'}，
{path:'products/：category/：market'，loadChildren:'./products/products.module#ProductsPageModule'}，
{path:'reports'，loadChildren:'./reports/reports.module#ReportsPageModule'}，
{path:'news'，loadChildren:'./news/news.module#NewsPageModule'}，
{path:'buy'，loadChildren:'./buy/buy.module#BuyPageModule'}，
{path:'Offers'，loadChildren:'./Offers/Offers.module#OffersPageModule'}，
{path:'cart'，loadChildren:'./cart/cart.module#CartPageModule'，runguard和resolvers:'always'}，
{path:'checkout'，loadChildren:'./checkout/checkout.module#checkoutagemodule'}，
];
@NGD模块({
导入：[RouterModule.forRoot（路由，{onNameUrlNavigation:'reload'}]，
导出：[路由模块]
})
导出类AppRoutingModule{}

当我第一次加载页面时，它会调用函数

ngAfterViewInit

。但是当我导航到其他路径并返回时，

ngAfterViewInit

不会被调用

如果我们重新加载页面，

ngOnInit

将不会被调用。因此我使用的是

ngAfterViewInit

，这没有帮助。这是预期的行为吗

---

如何在用户每次导航到页面时执行函数？

您可以订阅路由器事件

您是否使用路由更改整个组件？或者您的组件在两个页面上都保持稳定？检查当您导航到另一个路由时是否调用了Ngondestory。如果没有，则表示您的组件仍在加载。检查您的routing配置-可能您有嵌套路由？@UbiquitousDevelopers，用例是，我将向本地存储添加一条记录。当我返回此页面时，需要读取存储并重新绘制该记录。两个页面的组件不相同。@Shahar，对于此页面，不会调用ngDestroy。当我从上一页导航时，它会调用destroy.当导航到其他页面时，此页面没有调用ngDestroy。我在应用程序组件中附加了routerEvent。如何手动触发ngDestroy？@Santoshegde您不应该手动调用ngDestroy。它是组件生命周期的一部分，在组件被销毁时自动调用。