我开发了一个 HTML 5 应用程序,并有一个加载用户评论的 View 。它是递归的:任何评论都可以有可点击的子评论,它们加载在同一个 View 中并使用同一个 Controller 。
一切都好。但是,当我想返回时,评论又被加载了,我失去了我加载的位置和子评论。
返回时可以保存 View 的状态吗?我想我也许可以使用某种技巧,例如:每次单击子评论并隐藏以前的 View 时附加一个新 View 。但我不知道该怎么做。
最佳答案
是的,您应该将状态保存在服务中,而不是在 Controller 中加载和保存 UI 的状态。这意味着,如果您这样做:
app.config(function($routeProvider){
$routeProvider.when('/', {
controller: 'MainCtrl'
}).when('/another', {
controller: 'SideCtrl'
});
});
app.controller('MainCtrl', function($scope){
$scope.formData = {};
$scope./* other scope stuff that deal with with your current page*/
$http.get(/* init some data */);
});
您应该将初始化代码更改为您的服务,以及那里的状态,这样您就可以在多个 View 之间保持状态:
app.factory('State', function(){
$http.get(/* init once per app */);
return {
formData:{},
};
});
app.config(function($routeProvider){
$routeProvider.when('/', {
controller: 'MainCtrl'
}).when('/another', {
controller: 'SideCtrl'
});
});
app.controller('MainCtrl', function($scope, State){
$scope.formData = State.formData;
$scope./* other scope stuff that deal with with your current page*/
});
app.controller('SideCtrl', function($scope, State){
$scope.formData = State.formData; // same state from MainCtrl
});
app.directive('myDirective', function(State){
return {
controller: function(){
State.formData; // same state!
}
};
});
当您来回查看 View 时,它们的状态将被保留,因为您的服务是一个单例,当您第一次将其注入(inject) Controller 时已初始化。
还有新的
ui.router
,它有一个状态机,它是 $routeProvider
的低级版本您可以使用 $stateProvider
细粒度保持状态,但它目前是实验性的(并将在 angular 1.3 上发布)
关于angularjs - 在 AngularJS 中保存 View 的状态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22714409/