Angular單頁(yè)面動(dòng)態(tài)修改title[兼容微信]

Cheriselalala 發(fā)布于2019-08-22 11:03 / 617人閱讀

摘要：文件定義在通過(guò)路由定義標(biāo)題首頁(yè)首頁(yè)通過(guò)動(dòng)態(tài)調(diào)用標(biāo)題在里面定義通過(guò)監(jiān)聽(tīng)的變化來(lái)動(dòng)態(tài)調(diào)用標(biāo)題首頁(yè)首頁(yè)文件在里同過(guò)頭部里的動(dòng)態(tài)調(diào)用首頁(yè)

js文件 定義module

var app = angular.module("app", ["ngRoute"]);

在config通過(guò)路由定義標(biāo)題

 app.config(["$routeProvider", "$locationProvider", function ($routeProvider, $locationProvider) {
        $routeProvider
            .when("/index", {templateUrl: "../tpls/home.html", title: "首頁(yè)"})
            .otherwise({redirectTo: "/index", title: "首頁(yè)"});
    }]);

通過(guò)run動(dòng)態(tài)調(diào)用標(biāo)題

在里面定義run ,通過(guò)監(jiān)聽(tīng) $routeChangeSuccess的變化來(lái)動(dòng)態(tài)調(diào)用標(biāo)題

app.run(["$rootScope",  function ($rootScope) {
       
        $rootScope.$on("$routeChangeSuccess", function (event, current, previous) {
            $rootScope.title = current.$$route.title || "首頁(yè)";
            document.title = current.$$route.title || "首頁(yè)";
            var $body = angular.element("body");
            var $iframe = $("").on("load", function () {
                $timeout(function () {
                    $iframe.off("load").remove();
                }, 0);
            }).appendTo($body);

        });

HTML 文件

在html里同過(guò)頭部head里的title 動(dòng)態(tài)調(diào)用title


    首頁(yè)

GPU云服務(wù)器云服務(wù)器單頁(yè)面單頁(yè)面應(yīng)用工單管理頁(yè)面 aspx單頁(yè)面

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://m.specialneedsforspecialkids.com/yun/91692.html

相關(guān)文章

Angular 2+ 監(jiān)聽(tīng)路由變化動(dòng)態(tài)設(shè)置頁(yè)面標(biāo)題

摘要：今天我們實(shí)現(xiàn)單頁(yè)面應(yīng)用中路由變化設(shè)置頁(yè)面標(biāo)題，來(lái)優(yōu)化用戶的用戶體驗(yàn)。在中，解決起來(lái)要比容易得多，我們可以通過(guò)注入一個(gè)，在路由變化事件中使用提供的來(lái)動(dòng)態(tài)更新頁(yè)面標(biāo)題。現(xiàn)在很多web網(wǎng)站都采用了SPA單頁(yè)應(yīng)用，單頁(yè)面有很多優(yōu)點(diǎn)：用戶體驗(yàn)好、應(yīng)用響應(yīng)快、對(duì)服務(wù)器壓力小等等。同時(shí)也有一些缺點(diǎn)：首次加載資源太多，不利于SEO，前進(jìn)、后退、地址欄需要手動(dòng)管理。今天我們實(shí)現(xiàn)Angular單頁(yè)面應(yīng)...

entner 2019-08-20 17:37 評(píng)論0 收藏0
vue單頁(yè)面應(yīng)用中動(dòng)態(tài)修改title

摘要：適用于微信各大瀏覽器首先執(zhí)行命令用法之后在全局入口處，引入然后在路由中首頁(yè)活動(dòng)項(xiàng)目服務(wù)空間發(fā)現(xiàn)我的之后在各個(gè)組建中隨便一個(gè)標(biāo)簽中都可寫入想要?jiǎng)討B(tài)的改變值，可以這樣寫 vue-weachat-title ====================================== 適用于 1.微信 2.webview 3.各大瀏覽器－－－－－－－－ demo: http://www....

evin2016 2019-08-22 11:18 評(píng)論0 收藏0
angular2 + JSSDK的微信分享定制總結(jié)

摘要：本篇文章就記錄我的做微信分享信息定制的過(guò)程和踩坑總結(jié)。但是，這就要求在每個(gè)組件中都加微信分享代碼，會(huì)導(dǎo)致維護(hù)困難。在微信瀏覽器內(nèi)打開(kāi)任何網(wǎng)頁(yè)，若不配置分享接口，微信會(huì)默認(rèn)使用如下信息作為分享信息：默認(rèn)標(biāo)題：HTML的title 默認(rèn)連接：當(dāng)前頁(yè)面的地址，即location.href 默認(rèn)圖片：會(huì)取當(dāng)前頁(yè)面body內(nèi)最前面的一張符合條件的圖片（尺寸必須大于300px × 300px...

qylost 2019-08-20 14:51 評(píng)論0 收藏0
前端面試題總結(jié)（js、html、小程序、React、ES6、Vue、算法、全棧熱門視頻資源）

摘要：并總結(jié)經(jīng)典面試題集各種算法和插件前端視頻源碼資源于一身的文檔，優(yōu)化項(xiàng)目，在瀏覽器端的層面上提升速度，幫助初中級(jí)前端工程師快速搭建項(xiàng)目。本文是關(guān)注微信小程序的開(kāi)發(fā)和面試問(wèn)題，由基礎(chǔ)到困難循序漸進(jìn)，適合面試和開(kāi)發(fā)小程序。并總結(jié)vue React html css js 經(jīng)典面試題集各種算法和插件、前端視頻源碼資源于一身的文檔，優(yōu)化項(xiàng)目，在瀏覽器端的層面上提升速度，幫助初中級(jí)前端工程師快...

li21 2019-08-23 17:11 評(píng)論0 收藏0