【Angular】如何將路由策略由默認的history模式改成hash模式

我們使用angular的腳手架安裝的項目會提示我們是否需要安裝路由,我們通常都會選擇同意安裝,目前勤揩,angular默認的路由策略是不帶#的history模式策略俗批。

官網中是這么說的:

路由器通過兩種 LocationStrategy 提供者來支持所有這些風格:

  1. PathLocationStrategy - 默認的策略俗或,支持“HTML 5 pushState”風格。(也就是所謂的history模式)
  2. HashLocationStrategy - 支持“hash URL”風格岁忘。

RouterModule.forRoot() 函數把 LocationStrategy 設置成了 PathLocationStrategy辛慰,使其成為了默認策略。 你還可以在啟動過程中改寫(override)它干像,來切換到 HashLocationStrategy 風格昆雀。

但是history模式雖然漂亮,像是原生的url路由方式蝠筑。但是這種模式也有缺點:

  • 可能兼容性不太好,如果要兼容比較老版本的瀏覽器的話揩懒,可能不太行什乙。
  • 這個模式需要后臺配合進行設置,如果我們直接訪問這種路由已球,可能就直接報404的錯誤了臣镣。這個時候我們需要后臺人員的配合才可以。方法是:在服務端增加一個覆蓋所有情況的候選資源:如果url匹配不到任何的靜態(tài)資源智亮,則應該返回同一個index.html頁面忆某,這個頁面就是你的應用所依賴的頁面。詳細的配置阔蛉,我在angular官網中沒有找到弃舒,倒是在vue官網中有說明,詳情請見:HTML5 History 模式状原。

如果我們的后端小哥哥水平不行或者因為別的亂七八糟的原因聋呢,導致無法后端進行適配,就需要我們將默認的history模式改成hash模式才行颠区。

其實改的方式很簡單削锰,我們打開/src/app/app.module.ts這個項目的入口,然后修改一下其providers毕莱,代碼如下:

import {HashLocationStrategy, LocationStrategy} from '@angular/common';

@NgModule({
  declarations: [ //省略 ],
  imports: [ //省略 ],
  //將默認的PathLocationStrategy器贩,改成HashLocationStrategy。
  providers: [{
    provide:LocationStrategy,
    useClass:HashLocationStrategy,
  }],
  bootstrap: [AppComponent]
})
export class AppModule { }

然后我們刷新一下頁面朋截,就可以了蛹稍。

?著作權歸作者所有,轉載或內容合作請聯系作者
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市质和,隨后出現的幾起案子稳摄,更是在濱河造成了極大的恐慌,老刑警劉巖饲宿,帶你破解...
    沈念sama閱讀 219,490評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件厦酬,死亡現場離奇詭異胆描,居然都是意外死亡,警方通過查閱死者的電腦和手機仗阅,發(fā)現死者居然都...
    沈念sama閱讀 93,581評論 3 395
  • 文/潘曉璐 我一進店門昌讲,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人减噪,你說我怎么就攤上這事短绸。” “怎么了筹裕?”我有些...
    開封第一講書人閱讀 165,830評論 0 356
  • 文/不壞的土叔 我叫張陵醋闭,是天一觀的道長。 經常有香客問我朝卒,道長证逻,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,957評論 1 295
  • 正文 為了忘掉前任抗斤,我火速辦了婚禮囚企,結果婚禮上,老公的妹妹穿的比我還像新娘瑞眼。我一直安慰自己龙宏,他們只是感情好,可當我...
    茶點故事閱讀 67,974評論 6 393
  • 文/花漫 我一把揭開白布伤疙。 她就那樣靜靜地躺著银酗,像睡著了一般。 火紅的嫁衣襯著肌膚如雪徒像。 梳的紋絲不亂的頭發(fā)上花吟,一...
    開封第一講書人閱讀 51,754評論 1 307
  • 那天,我揣著相機與錄音厨姚,去河邊找鬼衅澈。 笑死,一個胖子當著我的面吹牛谬墙,可吹牛的內容都是我干的今布。 我是一名探鬼主播,決...
    沈念sama閱讀 40,464評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼拭抬,長吁一口氣:“原來是場噩夢啊……” “哼部默!你這毒婦竟也來了?” 一聲冷哼從身側響起造虎,我...
    開封第一講書人閱讀 39,357評論 0 276
  • 序言:老撾萬榮一對情侶失蹤傅蹂,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發(fā)現了一具尸體份蝴,經...
    沈念sama閱讀 45,847評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡犁功,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,995評論 3 338
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現自己被綠了婚夫。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片浸卦。...
    茶點故事閱讀 40,137評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖案糙,靈堂內的尸體忽然破棺而出限嫌,到底是詐尸還是另有隱情,我是刑警寧澤时捌,帶...
    沈念sama閱讀 35,819評論 5 346
  • 正文 年R本政府宣布怒医,位于F島的核電站,受9級特大地震影響奢讨,放射性物質發(fā)生泄漏裆熙。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,482評論 3 331
  • 文/蒙蒙 一禽笑、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧蛤奥,春花似錦佳镜、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,023評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至缅刽,卻和暖如春啊掏,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背衰猛。 一陣腳步聲響...
    開封第一講書人閱讀 33,149評論 1 272
  • 我被黑心中介騙來泰國打工迟蜜, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人啡省。 一個月前我還...
    沈念sama閱讀 48,409評論 3 373
  • 正文 我出身青樓娜睛,卻偏偏與公主長得像,于是被迫代替她去往敵國和親卦睹。 傳聞我的和親對象是個殘疾皇子畦戒,可洞房花燭夜當晚...
    茶點故事閱讀 45,086評論 2 355

推薦閱讀更多精彩內容