AngularJS中如何移除URL中的#

本篇文章為大家展示了AngularJS中如何移除URL中的#，內(nèi)容簡(jiǎn)明扼要并且容易理解，絕對(duì)能使你眼前一亮，通過(guò)這篇文章的詳細(xì)介紹希望你能有所收獲。

成都創(chuàng)新互聯(lián)公司主營(yíng)曲沃網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營(yíng)網(wǎng)站建設(shè)方案,成都App定制開(kāi)發(fā),曲沃h5小程序定制開(kāi)發(fā)搭建,曲沃網(wǎng)站營(yíng)銷(xiāo)推廣歡迎曲沃等地區(qū)企業(yè)咨詢

AngularJS 默認(rèn)將會(huì)使用一個(gè) # 號(hào)來(lái)對(duì)URL進(jìn)行路由.

例如:

http://example.com/
http://example.com/#/about
http://example.com/#/contact

要獲得干凈的URL并將井號(hào)從URL中移除是很容易的.

完成兩件事情就行了.

配置 $locationProvider
設(shè)置我們的相對(duì)連接的起點(diǎn)路徑

$location 服務(wù)

在Angular中, $location服務(wù)會(huì)解析地址欄中的URL，并對(duì)你的應(yīng)用程序作出改變，反之亦然.

我強(qiáng)烈推薦通讀官方的 Angular $location 文檔以對(duì)$location 服務(wù)及其所提供的特性有一個(gè)了解.

$locationProvider 和 html5 模式（html5Mode）

我們會(huì)使用 $locationProvider 模塊，并將html5Mode設(shè)置為true.

我們會(huì)在你定義Angular應(yīng)用程序并配置你的路由時(shí)做這些.

angular.module('scotchy', [])            .config(function($routeProvider, $locationProvider) {           $routeProvider              .when('/', {                  templateUrl : 'partials/home.html',                  controller : mainController              })              .when('/about', {                  templateUrl : 'partials/about.html',                  controller : mainController              })              .when('/contact', {                  templateUrl : 'partials/contact.html',                  controller : mainController              });                // use the HTML5 History API          $locationProvider.html5Mode(true);      });

什么是 HTML5 History API? 它是使用一個(gè)腳本來(lái)操作瀏覽器歷史的標(biāo)準(zhǔn)方法. 有了它就能在不刷新頁(yè)面的前提下讓 Angular 改變路由和頁(yè)面的URL. 更多的信息，這里有一篇蠻好的 HTML5 History API 文章.

為相對(duì)鏈接設(shè)置<base>

為了在應(yīng)用程序各處使用相對(duì)鏈接，你將需要在你文檔的<head>里面設(shè)置一個(gè)<set>.

<!doctype html> <html> <head>     <meta charset="utf-8">      <base href="/"> </head>

有大量的方法可以用來(lái)配置這個(gè)東西，而將HTML5Mode設(shè)置為true就會(huì)自動(dòng)的解析相對(duì)鏈接了. 在我這兒這種方式總是能起效. 如果你應(yīng)用程序的根同url相比有所不同,例如 /my-base, 那就用那個(gè)作為你的起點(diǎn)路徑.

老瀏覽器的回調(diào)

$location服務(wù)對(duì)不支持HTML5瀏覽歷史API的瀏覽器將自動(dòng)回調(diào)hashbang方法。

一切的發(fā)生對(duì)你是透明的，你不需為此做任何配置。從Angular $location文檔中，你可以看到回調(diào)的方法已經(jīng)它是如何工作的。

AngularJS中如何移除URL中的#

這是一個(gè)在Angular應(yīng)用中獲得漂亮URL并刪除哈希標(biāo)記的簡(jiǎn)單方法。

上述內(nèi)容就是AngularJS中如何移除URL中的#，你們學(xué)到知識(shí)或技能了嗎？如果還想學(xué)到更多技能或者豐富自己的知識(shí)儲(chǔ)備，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。

當(dāng)前標(biāo)題：AngularJS中如何移除URL中的#
URL分享：http://aaarwkj.com/article22/pcdpcc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供服務(wù)器托管、用戶體驗(yàn)、企業(yè)網(wǎng)站制作、虛擬主機(jī)、企業(yè)建站、域名注冊(cè)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容

欧美一级特黄大片做受成人-亚洲成人一区二区电影-激情熟女一区二区三区-日韩专区欧美专区国产专区

AngularJS中如何移除URL中的#

$location 服務(wù)

$locationProvider 和 html5 模式（html5Mode）

為相對(duì)鏈接設(shè)置<base>

老瀏覽器的回調(diào)