Angular UI路由器：如何保存父状态？

Question

我使用 IonicFramework，Angular UI 路由器和嵌套视图。

我的路由示例：

// Method app.config()
$stateProvider
      .state('main', {
        url: '',
        views: {
          '@' : {
            templateUrl: 'layout/main.html'
          },
          'topbar@main' : {
            templateUrl: 'component/topbar/topbar.html'
          },
          'content@main' : {
            templateUrl: 'component/pager/pager.html'
          }
        }
      })
      .state('settings', {
        templateUrl: 'component/settings/settings.html'
      })
    ;

我尝试从 'main' 进入 'settings' 状态 - 一切正常：$state.go('settings').

当我尝试单击“<返回”和 return 时，主状态重置为初始状态。

我发现 here 'settings' 必须是 'main' 的子项的提示。但我不知道如何实施。我所有的尝试都失败了。

问题：如何切换到另一个视图，保存上一个视图的状态？

谢谢。

Answer 1

ui-router nothing 关于保存应用程序状态。这里的解决方案是使用一个服务来持久化你的应用程序 state/data（在 AngularJS 的实现中，服务是一个单例）。

所以基本上是这样的：

angular.service('MyService', function() {
    var data = {};

    return {
        get: function() {
            return data;
        }
    };
});

function State1Controller($scope, MyService) { // you rely on AngularJS's built-in $injector

    $scope.data = MyService.get();
}

现在每次您使用这个控制器时，$scope.data 都会指向服务内部的同一个对象引用（它是一个单例）。因此，无论您在哪个控制器中使用它或执行了多少状态更改，您对 $scope.data 所做的任何更改都将是 "saved"。

此外，请记住，如果您在多个控制器中使用它并以与它为 $scope.data 分配了一个新的引用。你应该永远不要覆盖它，除非你知道你在做什么。

Angular UI路由器：如何保存父状态？

Angular UI Router: How to save parent state?

angularjs

angular-ui-router

ionic