angular.js - angualr-ui tabs 刷新后返回初始值
仅有的幸福
仅有的幸福 2017-05-15 16:57:42
0
2
689

RT,使用angular-ui里的tabs做选项卡切换的时候,不会记录当前选项卡选定状态,当有人手贱按刷新的时候,就会返回初始值。如何记录当前选项卡选定状态?

仅有的幸福
仅有的幸福

모든 응답(2)
世界只因有你

저도 최근 회사 마케팅 이벤트의 [시작] 페이지에서 작업할 때 시작이 &lt와 같이 4단계로 나누어져 있는 경우가 있었습니다. ;p ng-if= "step == 3" ui-view="step-3"></p>, ng-if를 사용하여 표시할 단계를 결정하세요. , 그리고 컨트롤러에서 다음과 같이 step을 설정하는 방법이 있습니다: <p ng-if="step == 3" ui-view="step-3"></p>, 通过ng-if来确定显示第几步, 然后在控制器中有一个方法来设置step,方法如下:

$scope.$on('changeStep', function(e, data) {
   $scope.step = data;
});

但是,当编辑到其中某一步时,如果刷新浏览器就会回到第1步状态。一开始我是用localStorage来存储step状态

$scope.step = $localStorage.step ? $localStorage.step : '1';
$scope.$on('changeStep', function(e, data) {
   $scope.step = data;
   $localStorage.step = data;
});
// 不在发起页面时清除数据
$scope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
  if (toState.name != 'app.xx.new' || toState.name != 'app.xx.edit' || toState.name != 'app.xx.view') {
    delete $localStorage.step;
  }
})

这样就可以保存状态了,但是有一个问题是,如果当前编辑到第3步,我又重新开一个窗口从列表页面进入编辑,会直进入第三步,跳过了前二步。
后来我也试过$cacheFactory, 一刷新状态就丢失了,所以最后的解决办法是使用sessionStorage 으아악

단, 특정 단계로 편집할 때 브라우저를 새로 고치면 첫 번째 단계로 돌아갑니다. 처음에는 단계 상태를 저장하기 위해 localStorage를 사용했습니다

으아악

이렇게 하면 상태를 저장할 수 있는데, 현재 편집이 3단계에 이르렀을 때 목록 페이지에서 편집에 들어가기 위해 창을 다시 열면 처음 두 단계를 건너뛰고 바로 세 번째 단계로 넘어가는 문제가 있습니다. .
나중에 $cacheFactory도 시도했지만 새로 고치자마자 상태가 사라졌으므로 최종 해결 방법은 sessionStorage를 사용하는 것이었습니다. 두 가지의 사용 시나리오를 이해하려면 array_huang 커뮤니티의 localstorage 기사를 읽어보세요. 🎜 🎜이 방법이 반드시 최선은 아니지만 대안으로 시도해 볼 수 있습니다. 🎜
漂亮男人

Angular 캐시 팩토리를 참고하세요

최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿