這篇文章主要介紹如何解決angular2中router路由跳轉(zhuǎn)navigate的使用與刷新頁面問題，文中介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們一定要看完！
成都創(chuàng)新互聯(lián)公司服務(wù)項目包括雜多網(wǎng)站建設(shè)、雜多網(wǎng)站制作、雜多網(wǎng)頁制作以及雜多網(wǎng)絡(luò)營銷策劃等。多年來，我們專注于互聯(lián)網(wǎng)行業(yè)，利用自身積累的技術(shù)優(yōu)勢、行業(yè)經(jīng)驗、深度合作伙伴關(guān)系等，向廣大中小型企業(yè)、政府機(jī)構(gòu)等提供互聯(lián)網(wǎng)行業(yè)的解決方案，雜多網(wǎng)站推廣取得了明顯的社會效益與經(jīng)濟(jì)效益。目前，我們服務(wù)的客戶以成都為中心已經(jīng)輻射到雜多省份的部分城市，未來相信會繼續(xù)擴(kuò)大服務(wù)區(qū)域并繼續(xù)獲得客戶的支持與信任！
一、router.navigate的使用
navigate是Router類的一個方法，主要用來跳轉(zhuǎn)路由。
函數(shù)定義：
navigate(commands: any[], extras?: NavigationExtras) : Promise``
重慶分公司
重慶分公司
interface NavigationExtras {
relativeTo : ActivatedRoute
queryParams : Params
fragment : string
preserveQueryParams : boolean
preserveFragment : boolean
skipLocationChange : boolean
replaceUrl : boolean
}1.this.router.navigate(['user', 1]);
以根路由為起點(diǎn)跳轉(zhuǎn)
2.this.router.navigate(['user', 1],{relativeTo: route});
默認(rèn)值為根路由，設(shè)置后相對當(dāng)前路由跳轉(zhuǎn)，route是ActivatedRoute的實(shí)例，使用需要導(dǎo)入ActivatedRoute
3.this.router.navigate(['user', 1],{ queryParams: { id: 1 } });
路由中傳參數(shù) /user/1?id=1
4.this.router.navigate(['view', 1], { preserveQueryParams: true });
默認(rèn)值為false，設(shè)為true，保留之前路由中的查詢參數(shù)/user?id=1 to /view?id=1
5.this.router.navigate(['user', 1],{ fragment: 'top' });
路由中錨點(diǎn)跳轉(zhuǎn) /user/1#top
6.this.router.navigate(['/view'], { preserveFragment: true });
默認(rèn)值為false，設(shè)為true，保留之前路由中的錨點(diǎn)/user/1#top to /view#top
7.this.router.navigate(['/user',1], { skipLocationChange: true });
默認(rèn)值為false，設(shè)為true路由跳轉(zhuǎn)時瀏覽器中的url會保持不變，但是傳入的參數(shù)依然有效
8.this.router.navigate(['/user',1], { replaceUrl: true });
未設(shè)置時默認(rèn)為true，設(shè)置為false路由不會進(jìn)行跳轉(zhuǎn)
二、router.navigate刷新頁面問題
造成這個問題一般是因為我們在
