angular.js-angualr-ui 탭은 새로 고침 후 초기 값으로 돌아갑니다.

Question

RT, 각도 UI에서 탭을 사용하여 탭을 전환하는 경우 현재 탭 선택 상태가 기록되지 않고 새로 고침을 누르면 초기 값이 반환됩니다. 현재 탭 선택 상태를 기록하는 방법은 무엇입니까?

Answer 1

저도 최근 회사 마케팅 이벤트의 [시작] 페이지에서 작업할 때 시작이 <와 같이 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 기사를 읽어보세요. 🎜 🎜이 방법이 반드시 최선은 아니지만 대안으로 시도해 볼 수 있습니다. 🎜

Answer 2

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