AngularJS中重新加載當(dāng)前路由頁(yè)面的方法
這個(gè)問(wèn)題同樣困擾我很久,網(wǎng)上的回答五花八門,全都不能解決;終于在網(wǎng)上找很久,看到某大神的解決辦法,整理作此分享;使用ui-router重新加載當(dāng)前頁(yè)面的問(wèn)題。(ui-router版本需要是0.2.14以上的)
用angular做項(xiàng)目,會(huì)碰到需要點(diǎn)擊菜單刷新當(dāng)前頁(yè)面,加載當(dāng)前頁(yè)面,但是同一個(gè)路由頁(yè)面點(diǎn)擊沒(méi)反應(yīng);
假設(shè)我們的路由頁(yè)面 app.toMenu ;
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" ui-sref="app.toMenu" ui-sref-opts="{reload:true}"> <!-- 網(wǎng)上普遍都說(shuō)這樣刷新,但這個(gè)是整個(gè)頁(yè)面也同時(shí)都刷新了 -->
其實(shí),reload除了可以傳遞布爾類型型參數(shù),還可以傳string和object型參數(shù),如果只是想刷新當(dāng)前的路由頁(yè)面,而不去連帶刷新父路由,我們可以把reload的參數(shù)值設(shè)置為當(dāng)前路由頁(yè)面標(biāo)識(shí)。
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" ui-sref="app.toMenu" ui-sref-opts="{reload:'app.toMenu'}"> <!-- 這個(gè)方法刷新當(dāng)前路由頁(yè)面 -->
另外也可以用$state.reload();
$state.reload()是加載整個(gè)頁(yè)面;
$state.reload('app.toMenu');加載當(dāng)前頁(yè)面;
<a href="" ng-click=" rel="external nofollow" reloadCurPage()"> <!-- controller里面 $scope --> $scope.reloadCurPage = function(){ $state.reload('app.toMenu'); }
注:如果標(biāo)識(shí)是變量的話
<a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" ui-sref="{{k.value}}" ui-sref-opts="{reload:'{{k.value}}'}">
以上這篇AngularJS中重新加載當(dāng)前路由頁(yè)面的方法就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
使用Angular9和TypeScript開(kāi)發(fā)RPG游戲的方法
這篇文章主要介紹了使用Angular9和TypeScript開(kāi)發(fā)RPG游戲的方法,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-03-03Angular7實(shí)現(xiàn)拖放Drag?Drop示例詳解
這篇文章主要介紹了Angular7實(shí)現(xiàn)拖放Drag?Drop示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-12-12完美解決UI-Grid表格元素中多個(gè)空格顯示為一個(gè)空格的問(wèn)題
下面小編就為大家?guī)?lái)一篇完美解決UI-Grid表格元素中多個(gè)空格顯示為一個(gè)空格的問(wèn)題。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-04-04Angular應(yīng)用程序的Hydration基本概念詳解
這篇文章主要為大家介紹了Angular應(yīng)用程序的Hydration基本概念詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09AngularJS模仿Form表單提交的實(shí)現(xiàn)代碼
本文通過(guò)一段實(shí)例代碼給大家簡(jiǎn)單介紹了angularjs模仿form表單提交的方法,非常不錯(cuò),具有參考借鑒價(jià)值,感興趣的朋友一起看看吧2016-12-12如何解決手機(jī)瀏覽器頁(yè)面點(diǎn)擊不跳轉(zhuǎn)瀏覽器雙擊放大網(wǎng)頁(yè)
這篇文章主要介紹了如何解決手機(jī)瀏覽器頁(yè)面點(diǎn)擊不跳轉(zhuǎn)瀏覽器雙擊放大網(wǎng)頁(yè)的相關(guān)資料,需要的朋友可以參考下2016-07-07Angular實(shí)現(xiàn)預(yù)加載延遲模塊的示例
本篇文章主要介紹了Angular實(shí)現(xiàn)預(yù)加載延遲模塊的示例,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10詳解為Angular.js內(nèi)置$http服務(wù)添加攔截器的方法
所謂攔截器就是在目標(biāo)達(dá)到目的地之前對(duì)其進(jìn)行處理以便處理結(jié)果更加符合我們的預(yù)期。Angular的$http攔截器是通過(guò)$httpProvider.interceptors數(shù)組定義的一組攔截器,每個(gè)攔截器都是實(shí)現(xiàn)了某些特定方法的Factory。本文就介紹了為Angular.js內(nèi)置$http服務(wù)添加攔截器的方法。2016-12-12