angular同一頁面跳轉(zhuǎn)重新執(zhí)行的實(shí)現(xiàn)方法

更新時(shí)間：2023年11月17日 16:56:19 作者：鑰零零

這篇文章主要介紹了angular同一頁面跳轉(zhuǎn)重新執(zhí)行的實(shí)現(xiàn)方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教

angular同一頁面跳轉(zhuǎn)重新執(zhí)行方法

問題

當(dāng)收到導(dǎo)航到當(dāng)前URL的請(qǐng)求，Angular路由器會(huì)忽略，重復(fù)點(diǎn)擊同一鏈接頁面不會(huì)刷新，也不會(huì)重新執(zhí)行ngOnInit函數(shù)

解決

1、跳轉(zhuǎn)時(shí)給Router中增加參數(shù)

this.router.navigate([path],{queryParams:{lang:'zh-cn'}})

2、在組件中訂閱queryParamMap，判斷有l(wèi)ang字段就重新執(zhí)行init方法

constructor(
    private sanitizer: DomSanitizer,
    private routerInfo: ActivatedRoute,) {
      this.routerInfo.queryParamMap.subscribe(params => {
        if (params.get('lang')) {
          this.init();
        }
     });
   }


init(): void{
    console.log('重新執(zhí)行了')
}

angularjs中界面跳轉(zhuǎn)或返回，界面刷新問題cache:false

問題描述

第一次進(jìn)界面，按鈕可以點(diǎn)擊，第二次進(jìn)去按鈕不能點(diǎn)擊了，按鈕事件是在controller里寫的。

解決方法

加上cache:false,即可。表示頁面重新刷新加載。

.state('tab.shouye', {
    cache:false,
    url: '/shouye',
    views: {
      'tab-shouye': {       
        templateUrl: 'App/Views/tab-shouye.html',     
        controller: 'shouyeCtrl'
      }
    }
  })

總結(jié)

以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

AngularJS 作用域詳解及示例代碼
本文主要介紹AngularJS 作用域的知識(shí)，這里整理了基礎(chǔ)資料，和示例代碼以及實(shí)現(xiàn)效果圖，有需要的小伙伴可以參考下
2016-08-08
AngularJS學(xué)習(xí)筆記之依賴注入詳解
下面小編就為大家?guī)硪黄狝ngularJS學(xué)習(xí)筆記之依賴注入詳解。小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2016-05-05
淺談Angularjs中不同類型的雙向數(shù)據(jù)綁定
這篇文章主要介紹了淺談Angularjs中不同類型的雙向數(shù)據(jù)綁定，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-07-07
淺析AngularJS中的指令
指令（Directives）是所有AngularJS應(yīng)用最重要的部分。盡管AngularJS已經(jīng)提供了非常豐富的指令，但還是經(jīng)常需要?jiǎng)?chuàng)建應(yīng)用特定的指令
2016-03-03
Angular實(shí)現(xiàn)類似博客評(píng)論的遞歸顯示及獲取回復(fù)評(píng)論的數(shù)據(jù)
這篇文章主要給大家介紹了關(guān)于Angular如何實(shí)現(xiàn)類似博客評(píng)論的遞歸顯示及獲取回復(fù)評(píng)論的數(shù)據(jù)的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。
2017-11-11
angularJs中json數(shù)據(jù)轉(zhuǎn)換與本地存儲(chǔ)的實(shí)例
今天小編就為大家分享一篇angularJs中json數(shù)據(jù)轉(zhuǎn)換與本地存儲(chǔ)的實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧
2018-10-10
angular項(xiàng)目中bootstrap-datetimepicker時(shí)間插件的使用示例
這篇文章主要介紹了angular項(xiàng)目中bootstrap-datetimepicker時(shí)間插件的使用示例,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-03-03
AngularJS表達(dá)式講解及示例代碼
本文主要講解AngularJS表達(dá)式,這里整理了相關(guān)資料和提供示例代碼以及實(shí)現(xiàn)效果圖，有需要的小伙伴可以參考下
2016-08-08
測(cè)試IE瀏覽器對(duì)JavaScript的AngularJS的兼容性
這篇文章主要介紹了測(cè)試IE瀏覽器對(duì)JavaScript的AngularJS的兼容性的方法,盡管隨著Windows10的近期上市,IE瀏覽器即將成為歷史...需要的朋友可以參考下
2015-06-06
Angular2 自定義validators的實(shí)現(xiàn)方法
angular 當(dāng)需要form表單需要驗(yàn)證時(shí)，angular自帶了許多校驗(yàn)器，但是很多時(shí)候自帶的無法滿足業(yè)務(wù)需求，這時(shí)候就需要自定義的校驗(yàn)器，下面通過本文給大家分享Angular2 自定義validators的實(shí)現(xiàn)方法，需要的朋友參考下吧
2017-07-07