使用AngularJS和UI-路由器更新标题标签 [英] Updating title tag using AngularJS and UI-Router

查看:199
本文介绍了使用AngularJS和UI-路由器更新标题标签的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我遇到了一个奇怪的问题,而试图使用当前状态的名称(通过UI路由器)来设置页面的标题。

I am running into a weird issue while trying to set the title of the page using the name of the current state (via ui-router).

实际上,该问题是不能与设置标题,这个问题是,标题被设定为下一个状态的history.pushState之前的标题。所以,当我过渡到一个新的URL,在历史上的第一个项目具有相同的名称为当前页面。

Actually, the issue is not with setting the title, the issue is that the title gets set to the title of the next state before the history.pushState. So when I transition to a new url, the first item in the history has the same name as the current page.

我只是与样品(<一打转转href=\"http://angular-ui.github.io/ui-router/sample/\">http://angular-ui.github.io/ui-router/sample/)我设法复制它那里。如果你点击关于,然后回到家里,你会看到2个不同的条目'家'。它们都指向正确的URL,但他们的名字错位。古怪的是,点击进入在Contact.list和contact.details正确地设置的历史。

I was just playing around with the sample (http://angular-ui.github.io/ui-router/sample/) and I managed to reproduce it there as well. If you click on About, then back on home you will see 2 different entries for 'home'. They both point to the correct url, but their names are mangled. Weirdly enough, clicking through the Contact.list and contact.details sets the history properly.

有没有办法解决?当管道请问history.pushstate被调用?

Is there a way around this? When in the pipeline does the history.pushstate get called?

推荐答案

我有一个'相似'的情况......,并回答它<一个href=\"http://stackoverflow.com/questions/23813599/set-page-title-using-ui-router/26086324#26086324\">here.

I had a 'similar' situation... and answered it here.

这基本上定义 $ rootScope。$状态= $状态角的run方法内。这允许我们访问当前状态信息模板。

It basically defines $rootScope.$state = $state inside of the run method of angular. That allows us to access current states info in templates.

<title ng-bind="$state.current.data.pageTitle"></title>

的关键是在run方法定义它的$ rootScope。

The key is defining it on the $rootScope in the run method.

这篇关于使用AngularJS和UI-路由器更新标题标签的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆