In the current version, when i go from, say a state 'a' to state 'b' and then come back to 'a', the template for 'a' is repainted, instead of restoring the template. Result is that the user-data in template 'a' is lost, as soon as i navigate away from 'a'.
在当前版本中,当我从一个状态'a'表示状态'b'然后再回到'a'时,'a'的模板被重新绘制,而不是恢复模板。结果是,一旦我离开'a',模板'a'中的用户数据就会丢失。
(the problem is there for angular's inbuilt routing service too).
(问题在于angular的内置路由服务)。
Now, this would be the sole reason i wouldn't like to have ui-router (everything else is fantastic), because this behavior doesn't fit one of our most important use-cases. Also to me personally, this doesn't seem like the most logical of the behaviors.
现在,这将是我不想拥有ui-router(其他一切都很棒)的唯一原因,因为这种行为不适合我们最重要的用例之一。对我个人而言,这似乎不是最合乎逻辑的行为。
I wanted to know if there's a way to achieve this using what is built-in.
我想知道是否有办法使用内置的方法实现这一目标。
(I was able to get this behavior after a few hack-arounds in the source code.)
(在源代码中有一些hack-arounds之后,我能够得到这种行为。)
2 个解决方案
#1
1
If you app is tracking state across views, there are two ways that i know you persist data across view changes.
如果您的应用是跨视图跟踪状态,我知道有两种方法可以跨视图更改保留数据。
-
One is to define the state of view on the parent scope of
ng-view
orui-view
. This scope can either be$rootScope
or a scope that is not change when navigation happens. For example if you define something like$rootScope.user={};
. Anywhere you inject the $rootScope you would get this user object which you can update.一种是定义ng-view或ui-view的父范围的视图状态。此范围可以是$ rootScope,也可以是导航发生时不会更改的范围。例如,如果您定义类似$ rootScope.user = {};的内容。注入$ rootScope的任何地方都可以获得可以更新的用户对象。
-
Second is to use a service to track the state of the model that is being worked. For example if you are working on creating user. You can create a service such as
UserCreateWuzard
with method\property such asuserToCreate
. Your controllers would depend upon this service to get and update the active user across views. Since services are singleton by nature you would not loose any data across view.其次是使用服务来跟踪正在工作的模型的状态。例如,如果您正在创建用户。您可以使用方法\属性(如userToCreate)创建UserCreateWuzard等服务。您的控制器将依赖此服务来跨视图获取和更新活动用户。由于服务本质上是单一的,因此您不会在视图中丢失任何数据。
#2
0
I had a similar need of preserving the template. After a little bit of searching I finally ran into this add-on: UI Router Extras: Sticky State
我有类似的需要保留模板。经过一些搜索后,我终于遇到了这个附加组件:UI Router Extras:Sticky State
Once you've added the library, you will need to update your routes:
添加库后,您需要更新路线:
$stateProvider.state('billing', {
sticky: true,
views: {
'billing' : {
templateUrl: 'billing.html',
controller: 'BillingController'
}
}
});
You'll also need to add a container for the view/template that you need to preserve
您还需要为需要保留的视图/模板添加容器
<main ui-view></main>
<div ui-view="billing" ng-show="$state.current.name==='billing'"></div>
#1
1
If you app is tracking state across views, there are two ways that i know you persist data across view changes.
如果您的应用是跨视图跟踪状态,我知道有两种方法可以跨视图更改保留数据。
-
One is to define the state of view on the parent scope of
ng-view
orui-view
. This scope can either be$rootScope
or a scope that is not change when navigation happens. For example if you define something like$rootScope.user={};
. Anywhere you inject the $rootScope you would get this user object which you can update.一种是定义ng-view或ui-view的父范围的视图状态。此范围可以是$ rootScope,也可以是导航发生时不会更改的范围。例如,如果您定义类似$ rootScope.user = {};的内容。注入$ rootScope的任何地方都可以获得可以更新的用户对象。
-
Second is to use a service to track the state of the model that is being worked. For example if you are working on creating user. You can create a service such as
UserCreateWuzard
with method\property such asuserToCreate
. Your controllers would depend upon this service to get and update the active user across views. Since services are singleton by nature you would not loose any data across view.其次是使用服务来跟踪正在工作的模型的状态。例如,如果您正在创建用户。您可以使用方法\属性(如userToCreate)创建UserCreateWuzard等服务。您的控制器将依赖此服务来跨视图获取和更新活动用户。由于服务本质上是单一的,因此您不会在视图中丢失任何数据。
#2
0
I had a similar need of preserving the template. After a little bit of searching I finally ran into this add-on: UI Router Extras: Sticky State
我有类似的需要保留模板。经过一些搜索后,我终于遇到了这个附加组件:UI Router Extras:Sticky State
Once you've added the library, you will need to update your routes:
添加库后,您需要更新路线:
$stateProvider.state('billing', {
sticky: true,
views: {
'billing' : {
templateUrl: 'billing.html',
controller: 'BillingController'
}
}
});
You'll also need to add a container for the view/template that you need to preserve
您还需要为需要保留的视图/模板添加容器
<main ui-view></main>
<div ui-view="billing" ng-show="$state.current.name==='billing'"></div>