Ionic 4 迁移：什么是 Ionic 3 生命周期事件/导航守卫的 Angular 等价物？

Question

我在进行 Ionic 3 到 4 迁移时遇到了困难。官方迁移指南要求我们使用“适当的 Angular 替代方案”。谁能告诉我以下Ionic 3 生命周期钩子的等效Angular 生命周期钩子替代品。

1. ionViewDidLoad
2. ionViewWillEnter [未替换]
3. ionViewDidEnter [未替换]
4. ionViewWillLeave [未替换]
5. ionViewDidLeave [未替换]
6. ionViewWillUnload
7. ionViewCanEnter
8. 离子视图可以离开

请帮我匹配上面的

1. ngOnChanges()
2. ngOnInit()
3. ngDoCheck()
4. ngAfterContentInit()
5. ngAfterContentChecked()
6. ngAfterViewInit()
7. ngAfterViewChecked()
8. ngOnDestroy()

编辑：我确实已经阅读了Ionic 4 路由器插座文档。

Answer 1

ionViewDidLoad => ngOnInit()

ionViewWillUnload => ngOnDestroy()

来自角度文档：

ngOnInit()
在 Angular 首先显示数据绑定属性并设置指令/组件的输入属性后初始化指令/组件。

ngOnDestroy()

在 Angular 销毁指令/组件之前进行清理。取消订阅 Observables 并分离事件处理程序以避免内存泄漏。

对于 ionViewCanEnter() 和 ionViewCanLeave() 您必须按照文档中的建议使用Router Guards 。例如。如果您想保护路由免受未经身份验证的用户的侵害，您必须首先创建服务文件来检查身份验证

import { Injectable } from '@angular/core';
import { Router, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';

@Injectable()
export class AuthGuard implements CanActivate {

constructor(private router: Router) { }

canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
    if (isAuthenticated) {
        // logged in so return true
        return true;
    }

    // not logged in so redirect to login page with the return url
    this.router.navigate(['/login']);
    return false;
}
}

然后在您的路由路径中使用 canActivate 属性中的服务：

{path:'home',component:HomeComponent,canActivate:[AuthGuard]}