I have also encountered the same problem. When I was working on the [Initiation] page of a company's marketing event recently, the initiation was divided into 4 steps. I used each step as a named view, such as:

, 通过ng-if来确定显示第几步， 然后在控制器中有一个方法来设置step. The method is as follows:

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

However, when editing to a certain step, if you refresh the browser, you will return to the first step. At first I used localStorage to storestepstatus

$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; } })

This way you can save the state, but there is a problem. If the current editing reaches step 3, and I reopen a window to enter editing from the list page, it will go directly to the third step, skipping the first two steps.
I also tried it later$cacheFactory, 一刷新状态就丢失了，所以最后的解决办法是使用sessionStorage. You can read the article localstorage by community array_huang to understand the usage scenarios of the two.

This method is not necessarily the best, but it can be tried as an alternative.

Refer to angular cache factory