$stateChangeStart 删除最初启用的 event.preventDefault
Posted
技术标签:
【中文标题】$stateChangeStart 删除最初启用的 event.preventDefault【英文标题】:$stateChangeStart remove event.preventDefault that was originally enabled 【发布时间】:2015-04-29 11:34:13 【问题描述】:我正在阻止用户转到另一个页面执行类似的操作,但是,当需要继续访问我最初阻止的页面时,我收到错误 "transition prevented”
。
如何删除原来的阻止并允许页面继续?我试图返回 false
而不是 event.preventDefault
但它没有用。请问有什么帮助吗?
$rootScope.$on($stateChangeStart, function(e, toState, toParams, fromState, fromParams)
if (isCurrentPageCompleted === false)
e.preventDefault();
);
【问题讨论】:
【参考方案1】:第一种方法
如果我们想让用户去某个页面,只有加载了一些数据,我们可以使用resolve
.state("prevented",
...
resolve:
someKey : // promise, which once resolved
// - then it will allow state transition
// function() return ...
第二种方法
但是如果我们想要重定向用户,在满足某些条件之前,我们可以使用一些全局服务。有a working plunker。
.factory("BreakTransition", function()
return
ShouldWaitGlobally : true,
)
然后我们可以有一些状态。
一个是默认的,用于重定向('home'
)。
在启用全局转换之前会阻止一些 ('prevented'
)
其中之一可能是推动者 ('enabler'
)
.state('家', 网址:“/家”, templateUrl: 'tpl.html', ) .state('启动器', 网址:“/启用”, templateUrl: 'tpl.enabler.html', 控制器:“启动器控制器”, ) .state('阻止', 网址:“/阻止”, templateUrl: 'tpl.html', 数据 : 应该WaitForCompletion:真, , )
而现在,在出厂值改变之前,我们可以使用这个“break”
.run(['$rootScope', '$state', 'BreakTransition',
function ($rootScope, $state, BreakTransition)
$rootScope.$on('$stateChangeStart', function(e, toState, toParams
, fromState, fromParams)
var shouldNotWait = toState.name === "home"
if(shouldNotWait)
return;
var isCurrentPageCompleted = BreakTransition.ShouldWaitGlobally !== true
|| (toState.data || ).ShouldWaitForCompletion !== true;
if (isCurrentPageCompleted === true)
return;
e.preventDefault();
$state.go('home');
);
])
检查all in action here
【讨论】:
以上是关于$stateChangeStart 删除最初启用的 event.preventDefault的主要内容,如果未能解决你的问题,请参考以下文章
angularjs 如何在页面没有登录的情况下阻止用户通过更改url进入页面--$stateChangeStart
ui-router中使用$stateChangeStart来实现WEB用户登录跳转
Angular Webpack ES2015 组件构建中未触发 angular-ui-router $stateChangeStart 事件
AngularJs Run块$ stateChangeStart未被触发