Angular ngOnInit在路由共享组件上不起作用
Angular中的ngOnInit是一个生命周期钩子函数，用于在组件初始化时执行一些初始化操作。然而，在路由共享组件上使用ngOnInit可能会出现不起作用的情况。
路由共享组件是指在多个路由之间共享的组件，通常用于在不同的路由中显示相同的内容或执行相同的操作。由于路由共享组件在不同的路由中被复用，它们的初始化可能只会在第一次加载时执行一次。
当在路由共享组件上使用ngOnInit时，由于组件的初始化只会在第一次加载时执行一次，所以在其他路由中切换时，ngOnInit不会再次触发。这就导致了ngOnInit在路由共享组件上不起作用的现象。
解决这个问题的方法是使用Angular提供的其他生命周期钩子函数，如ngOnChanges、ngDoCheck等，根据具体需求选择合适的钩子函数来执行初始化操作。
另外，对于路由共享组件，也可以考虑将初始化操作放在路由守卫中执行。路由守卫是Angular提供的一种机制，用于在路由切换前执行一些操作，可以在路由守卫中执行组件的初始化操作，以确保每次路由切换时都能执行相应的逻辑。
总结起来，当在路由共享组件上使用ngOnInit时，可能会出现不起作用的情况。解决这个问题的方法是使用其他生命周期钩子函数或将初始化操作放在路由守卫中执行。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云原生容器服务（TKE）：https://cloud.tencent.com/product/tke
- 腾讯云数据库（TencentDB）：https://cloud.tencent.com/product/cdb
- 腾讯云人工智能（AI）：https://cloud.tencent.com/product/ai
- 腾讯云物联网（IoT）：https://cloud.tencent.com/product/iotexplorer
- 腾讯云移动开发（移动推送、移动分析、移动测试等）：https://cloud.tencent.com/product/mobile
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云区块链（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云元宇宙（Tencent XR）：https://cloud.tencent.com/product/xr
相关·内容
我有一个组件"MenuComponent“，当单击侧边栏中的链接时，它会加载一个菜单。"我在做这件事； let menuid = this.route.snapshot.params.id; this.LocalService.AllPlacements.Activate(placementid);但是，
浏览 14提问于2017-08-02得票数 0
1回答
我是angular 6的新手。我正在使用angular 6创建一个项目。我在共享数据时遇到了一个问题。项目结构如下： 1)标题组件2登录组件3)主页组件4)共享服务 我在当前路由的基础上将类添加到我的头组件中。这是在页面刷新上工作的。但是当我从一个组件移动到另一个组件时，这是不起作用的。> Header组件： n
浏览 18提问于2019-03-13得票数 1
回答已采纳
2回答
我在我的共享模块中创建了一个组件，它是头组件，所以我想在我的所有组件中调用它。在我的共享组件中，让我们称它为app-header组件，我想接受输入buttonLink: string、buttonName: string和buttonLink: any (因为我搞混了)我的组件：use this组件：import { NgModule } from '@
浏览 1提问于2018-11-09得票数 2
我对RC4路由器的行为有一个问题，因为我已经将angular2版本从beta升级到了RC4。html的一部分，并将路由器导航调用到相同的组件。最近在angular2中进行了升级，如果在实例化组件时已经调用了to相同组件的ngOnInit，则不会调用它。
我必须在路由之后再次实例化相同的组件，以支持我的应用程序中的业务逻辑。，到homeComponent的路由也不会发生。我不能以任何方式破坏初始化的<
浏览 1提问于2016-07-20得票数 2
我是Angular 6的新手。我正在使用Angular 6创建一个应用程序。在开发过程中，我遇到了一个问题，那就是在组件之间共享数据。代码如下： 我有两个组件1)注册2)验证 注册从路由/signup打开，验证从/verification打开。现在，我要将对象从注册传递到验证组件 以下是我的示例代码。verfication component
export class verfication Component i
浏览 14提问于2019-04-05得票数 0
我有一个表orders..each表，行代表一个订单实体，当用户点击一个特定的行时，它应该重定向到一个新视图，其中包含点击的订单.These的详细信息两个组件不是父组件和子组件，我希望将有关点击的订单行的数据传递到导航页面order.session}}</td> </td>这会使视图导航到Orderdetails
ngOnInit
浏览 0提问于2020-02-09得票数 4
回答已采纳
2回答
我有两个组件，我想打印子组件中的文本从父组件单击。父组件：selector: 'parent', }
const text =
浏览 3提问于2018-01-04得票数 0
14回答
我使用一些查询字符串参数在同一个页面上调用router.navigate。在这种情况下，ngOnInit()不调用。默认情况下，还是需要添加其他内容？
浏览 32提问于2017-01-16得票数 134
回答已采纳
在选择第一条记录时，该记录的id将传递给用户页面。在读取该Userid之后，我希望显示该用户和模块/子模块的详细信息。import { Component, OnInit } from '@angular/core';
this.usernam
浏览 2提问于2018-02-13得票数 0
我有一个多语言网站，使用下拉选择，以允许用户在英语和德语之间切换语言。这是我的应用程序中的页脚组件，在更改选择时，应用程序将运行changeLanguage()函数： private pageService: PageServiceChangeDetectorRef, private route: ActivatedRoute
ngOnInit在
浏览 5提问于2018-04-24得票数 1
我有我的服务，我想用它在我的两个组件之间共享数据(我不想使用queryParams或类似的东西，因为我不想在url栏中显示我想要共享的数据)： import { Injectable } from '@angular/core';
export class DataService {
...
浏览 7提问于2019-12-15得票数 0
回答已采纳
2回答
是否可以通过相同的routerLink刷新组件映射？让我们假设这种情况：
appRoutes:路由=//其他路线.{路径：“一些/:格式代码”，组件: SomeComponent}，//其他路由.
用户尝试提交表单。，我在</e
浏览 3提问于2017-04-11得票数 2
在Angular2中，有可能将数据从一个路由返回到另一个路由吗？类似于使用modals搜索/选择一些数据，然后返回数据。我在找这样的东西：
在<
浏览 6提问于2016-09-24得票数 0
3回答
我用的是角7我使用此代码在路由到另一个组件时传递数据。This.router.navigate(‘/积’，{state：{token: data.token}})；ngOnInit() {
console.log("#25
浏览 0提问于2019-09-14得票数 4
回答已采纳
如何在角4环境中通过router.navigate将值传递给@Input？内联很好：但我想要的是随着价值的流逝。
浏览 1提问于2017-07-24得票数 4
当使用http从服务器加载第一个time.ngOnInit文件时，效果很好。employee组件已经加载，除非我重新编译代码，否则我将无法看到插入到表中的新记录。调用API，该API在组件第一次加载时加载得很好。当我提交表单时，它会转到我的API中，然后被重定向回employee组件，但是数据并没有按应该更新的方式更新。
我为这么小的职位感到抱歉。我对这个网站有点陌生。所发生的情况是，当第一次加载组件时，我们将调用ngOnInit，这只会在引导角度应用程序时触发一次。这
浏览 8提问于2017-06-02得票数 24
localhost:4200/app/2在这里我们要动态地从url获取id ..。
如何在引导应用程序时直接从url中获取app组件中的参数值2.
浏览 0提问于2018-02-12得票数 1
2回答
我想创建一个链接，供用户点击以验证他们的电子邮件。要做到这一点，我需要创建链接。如何将this.router转换为字符串？我还需要检索用户的用户id。如果不可能，我可以创建一个传入相对路径的字符串吗？let loginRoute = this.router.navigateByUrl("./login", {});
浏览 0提问于2019-05-16得票数 0
路由 { path: '', terminal: true, redirectTo: '/schoolyears：import { ROUTER_DIRECTIVES } from '@angularActivatedRoute, private
浏览 3提问于2016-06-30得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
