单页应用的页面title大家都是怎么处理的

发布于 2022-09-01 23:16:14 字数 163 浏览 10 评论 0

现在越来越多的网站都在使用spa技术，前端自己路由，局部刷新页面，来实现的单页应用也就webapp，相比较之前的整站都是独立的页面，每个页面都有单独的html来写上<title>你是猴子派来的逗比么</title>，那单页应用大家是怎么处理页面title问题的了

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

少女七分熟 2022-09-08 23:16:14

在stackoverflow上面看到一个答案，他是这样实现的

先在html上面加了一个全局的controller：

    <html ng-app="plunker" ng-controller="MainCtrl">

接着写了一个factory：

    app.factory('Page', function(){
      var title = 'default';
      return {
        title: function() { return title; },
        setTitle: function(newTitle) { title = newTitle; }
      };
    });

然后index.html主页面中就可以通过<h1>{{ Page.title() }}</h1>获取页面标题了
具体对应的那个页面要设置标题就很简单了，只要把这个Page注入到你的controller里面就可以了

    function Page2Ctrl($scope, Page) {
      Page.setTitle('title1');
    }

这里是具体的实现：http://plnkr.co/edit/0e7T6l?p=info

回复收藏 0

追星践月 2022-09-08 23:16:14

js 中使用 document.title = '...' 就能修改 title 了

如果想要效果更好，可以使用 H5 的新特性 history.pushState(state, title, url) ，这个方法不但能修改 title ，还能同时修改 url 地址，并将这些信息记录到历史堆栈中，当用户使用浏览器的返回按钮时会得到更佳的体验。

回复收藏 0

寂寞清仓 2022-09-08 23:16:14

<title>{{mainAppCtrl.title}}</title>

回复收藏 0

~没有更多了~

关于作者

梦忆晨望

暂无简介

0 文章

0 评论

22 人气

关注发私信

友情链接

文江博客

单页应用的页面title大家都是怎么处理的

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（3）

关于作者

相关话题

热门标签

推荐作者

lioqio

Single

禾厶谷欠

alipaysp_2zg8elfGgC

qq_N6d4X7

放低过去

友情链接

单页应用的页面title大家都是怎么处理的

如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

评论（3）

关于作者

相关话题

热门标签

推荐作者

lioqio

Single

禾厶谷欠

alipaysp_2zg8elfGgC

qq_N6d4X7

放低过去

友情链接

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。