angularjs – 在Angular 2中更改Route Change上的页眉和页脚内容

发布时间：2020-12-17 06:59:00 所属栏目：安全来源：网络整理

导读：我正在开发一个简单的Angular 2应用程序,我目前拥有的路由是/ login,/ register,/ home和/ profile. 在主应用程序组件上,我有一个 header部分,内容部分和 footer部分.我目前有 router-outlet / router-outlet在内容部分中,但是当内容部分中存在不同内容时,还

我正在开发一个简单的Angular 2应用程序,我目前拥有的路由是/ login,/ register,/ home和/ profile.

在主应用程序组件上,我有一个< header>部分,<内容>部分和< footer>部分.我目前有< router-outlet>< / router-outlet>在内容部分中,但是当内容部分中存在不同内容时,还希望(有时)更改页眉和页脚组件中的某些内容.

我已经研究了子路由(并计划在内容部分中使用某些路由),但我不确定这是否是最好的方法,甚至可能.我所做的儿童路线研究来自John Papa的Angular 2课程,这是他的榜样：http://a2-first-look.azurewebsites.net/examples/router-child/plnkr.demo.html?bust=1463590738850

我还探讨了在Header和Footer组件中订阅路由器的变化,并使用* ngIf渲染不同的html.这种方法似乎创建了一个全新的服务SO 1,但这个似乎更直接SO 2.我在想我可以用原生的Router指令做些什么？

任何帮助或正确方向的一点将不胜感激！谢谢

解决方法

你可以将它放入你的运行块：

$rootScope.$on('$routeChangeSuccess',function (event,current,previous) {
    SomeService.header.dynamicText = 'Hello,World'
    SomeService.footer.dynamicText = 'Contact Us'
})

当然,您还必须将SomeService传递给您的run函数.

更多关于这个方便的小服务here

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!