我使用与流星AngularJS并希望重定向与未验证电子邮件到登录页面的用户。我创建鉴于标志在 /client/routes.js
:
的app.config(['$ stateProvider','$ urlRouterProvider',功能($ stateProvider,$ urlRouterProvider){ $ urlRouterProvider.otherwise('/'); $ stateProvider .STATE('登入',{ 网址:'/登入', 观点:{ 主:{ templateUrl:客户端/视图/型材/ signin.tpl } } })
请注意,有其他国家我不上市为简洁起见。
现在,我想,如果他们的电子邮件没有被证实将用户重定向到这个登录页面。如何从 UI-路由器常见问题解答满足我的需求?不使用例如其他的解决方案,只要它们在手解决这一问题的下面是可接受的我
例:利用数据对象的状态config来定义规则 将运行逻辑与用户功能(使用这里的例子 服务,即$的currentUser)。在$ stateChangeStart处理程序捕获 所有的状态转换,并允许之前执行这个规则检查 转型,可能阻止它和/或重定向到一个不同的 状态。
的app.config(函数($ stateProvider){ $ stateProvider.state('privatePage',{ 数据:{ 规则:功能(用户){ // ... } });});app.run(函数($ rootScope,$状态,$的currentUser){ $ rootScope。在$('$ stateChangeStart'功能(即到){ 如果收益率(angular.isFunction(to.data.rule)!); VAR的结果= to.data.rule($的currentUser); 如果(结果&安培;&安培; result.to){ 亦即preventDefault(); //(可选)设置option.notify为false,如果你不想要 //重新触发另一个$ stateChangeStart事件 $ state.go(result.to,result.params,{通知:假}); } });});
解决方案
从常见问题的例子尝试创建一个规则添加到任何页面的通用方法。让我们保持简单:
app.run(函数($ rootScope,$状态,UserService){ $ rootScope。在('$ stateChangeStart'$,功能(事件,toState){ //不检查在登录身份验证航线 如果([登入]。的indexOf(toState.name)=== -1){ 如果(UserService.doesNotHaveVerifiedEmail()){ 。事件preventDefault(); $ state.go('登入'); 返回; } } }});
任何时候的状态加载,它不是的登入的状态,检查用户验证(取决于您的应用程序,我在这里注入UserService我假设有大约用户的状态知识),如果没有,你prevent的状态变化,并将其重定向到登录页面。
I am using AngularJS with Meteor and wanted to redirect users with unverified emails to the sign in page. I have created a sign in view in /client/routes.js
:
app.config(['$stateProvider', '$urlRouterProvider',
function($stateProvider, $urlRouterProvider){
$urlRouterProvider.otherwise('/');
$stateProvider
.state('signin', {
url:'/signin',
views: {
main: {
templateUrl: 'client/views/profile/signin.tpl'
}
}
})
Note that there are other states I am not listing for brevity sake.
Now, I want to redirect users to this sign in page if their emails have not been verified. How do I modify the example below from UI-Router FAQs to meet my needs? Other solutions not using the example below are acceptable to me as long as they address the issue at hand.
Example: Uses the data object on the state config to define a rule function that will run logic against the user (here using an example service called $currentUser). The $stateChangeStart handler catches all state transition and performs this rule check before allowing the transition, potentially blocking it and/or redirecting to a different state.
app.config(function($stateProvider) {
$stateProvider.state('privatePage', {
data: {
rule: function(user) {
// ...
}
});
});
app.run(function($rootScope, $state, $currentUser) {
$rootScope.$on('$stateChangeStart', function(e, to) {
if (!angular.isFunction(to.data.rule)) return;
var result = to.data.rule($currentUser);
if (result && result.to) {
e.preventDefault();
// Optionally set option.notify to false if you don't want
// to retrigger another $stateChangeStart event
$state.go(result.to, result.params, {notify: false});
}
});
});
解决方案
The example from the FAQ attempts to create a general way to add a rule to any page. Let's keep it simple:
app.run(function($rootScope, $state, UserService) {
$rootScope.$on('$stateChangeStart', function(event, toState) {
// don't check auth on login routes
if (["signin"].indexOf(toState.name) === -1) {
if (UserService.doesNotHaveVerifiedEmail()) {
event.preventDefault();
$state.go('signin');
return;
}
}
}
});
Anytime a state is loaded and it's not the signin state, you check if the user is verified (depends on your application, here I am injecting a UserService which I assume has knowledge about the user's status) and if not, you prevent that state change and redirect them to the signin page.