angular.js - angularjs不同標(biāo)簽頁切換 ui-view,且不 刷新頁面
問題描述
html:
<p class='nav'><p class='nav_container'> <span ng-repeat='nav in navs' ui-sref-active='li_selected' ui-sref='.{{nav.url}}'>{{nav.name}}<em ng-click='CloseNav(nav.value)'></em> </span></p> </p> <p ><p ui-view='' ng- style='overflow:auto;'></p> </p>
如圖所示,點(diǎn)擊不同的標(biāo)簽,ui-view區(qū)域顯示不同的頁面。但是在切換頁面的同時,會重新刷新頁面,我在頁面上的操作都會被刷新掉。我想實(shí)現(xiàn)大概如:
<p ui-view='html1' ng-show='html1'></p> <p ui-view='html2' ng-show='html2'></p> <p ui-view='html3' ng-show='html3'></p> <p ui-view='html4' ng-show='html4'></p>
通過不同的標(biāo)簽頁來控制不同ui-view的顯示,或隱藏,同時保留用戶的操作,不用刷新頁面。剛學(xué)習(xí)angularjs,對ui-view使用不熟練,求大神解答我這思路是不是正確的,能實(shí)現(xiàn)的話給出詳細(xì)的代碼;不正確的話,有什么別的辦法嗎,也請給出詳細(xì)的代碼,謝謝了!!
問題解答
回答1:設(shè)置一個ui-view就夠了,只需要對不同的state加載不同的temlpate
回答2:你這個和ui-router無關(guān),普通的頁面切換本身就不能保存input里面輸入的東西你可以:
頁面輸入的數(shù)據(jù),當(dāng)切換tab時持久化到后端,即切換先保存
或者保存到service中
或者保存到localstorage中總之找個地方存起來,再切換回來的時候再拿到
另可參考:sof
回答3:首先,切換tab不需要刷新頁面,可以用angular.factory創(chuàng)建一個緩存,數(shù)據(jù)修改后進(jìn)行緩存。如果沒有用router,想用ng-show控制4個view的顯示,可以把ui-view換成include
回答4:每個tab對應(yīng)一個ui-view,每個頁面顯示在不同的view里面就可以了
回答5:angular.factory創(chuàng)建一個緩存,數(shù)據(jù)修改后進(jìn)行緩存,@prototype
使用緩存,這思路不錯,我學(xué)習(xí)了
