Javascript 使用ui路由器切换状态时保持$scope

我正在为教程创建AngularJS应用程序，我需要从服务中填充教程数据，并将其显示在UI上的三个面板中。 第一个面板包含主题列表，第二个面板包含子主题列表，第三个面板包含数据

最初，当我们没有选择任何主题时，服务应该返回1个主题的子主题和第一个子主题的数据

当您单击任何其他子主题时，服务应返回给定子主题的数据。但一旦状态改变，控制器就会重新实例化，并丢失我们最初在UI上显示的主题/子主题列表的数据

请参阅

可能的解决方案-当我们单击任何子主题时，我们应该从localstorage或sessionStorage中的某个位置过度填充tops/subtopics数据，并将其与具有所需输出的服务数据合并

---

是否有其他方法使用Angular实现三级动态导航？

您可以将数据存储在服务中，状态更改后不会重置

---

类似的问题。

正如您完美地提到的，localstorage始终是数据存储的好方法。我个人更喜欢使用

$rootscope

模型在各州传递数据

app.controller('topicController', ['$scope','TopicProvider','$rootScope',function($scope,TopicProvider,$rootScope){

  var t = TopicProvider.get(function(tp){
    $scope.t = tp.topics;
    $scope.st = tp.subtopics;
    $scope.d = tp.data;
  });
  //pass data between the states
  $rootScope.dummyModel = "test";
}]);



app.controller('anotherController', ['$scope','TopicProvider','$rootScope',function($scope,TopicProvider,$rootScope){
  //get that model
  alert($rootScope.dummyModel);
}]);

这可能会有帮助：