[英]Dart angular2 with @canActivate
关于Dart和angular2的教程不足以解释,如何保护和授权我的应用程序。
如何在angular2中实现CanActivate
和Routers?
这是一个使用CanActivate
来保护组件( 源 )的示例;
import 'dart:html';
import 'package:angular2/core.dart';
import 'package:angular2/router.dart';
@Component(
selector: 'my-app',
styleUrls: const ['app_component.css'],
template: '''
<h1>My First Angular 2 App</h1>
<div>
<a [routerLink]="['Home']">home</a> -
<a [routerLink]="['General']">general area</a> -
<a [routerLink]="['Secret']">secret area</a>
</div>
<router-outlet></router-outlet>
''',
directives: const [ROUTER_DIRECTIVES],
providers: const [ROUTER_PROVIDERS],
)
@RouteConfig(const [
const Route(
path: '/', name: 'Home', component: HomeComponent, useAsDefault: true),
const Route(path: '/secret', name: 'Secret', component: SecretComponent),
const Route(path: '/general', name: 'General', component: GeneralComponent),
])
class AppComponent {}
@Component(
selector: 'secret-area',
template: '<div>Welcome to the secret area</div>',
)
@CanActivate(secretValidator)
class SecretComponent {}
secretValidator(ComponentInstruction next, ComponentInstruction prev) {
if (prev.routeName == 'General') return true;
window.alert('Unauthorized');
}
@Component(
selector: 'general-area',
template: '<div>Welcome to the general area</div>',
)
class GeneralComponent {}
@Component(
selector: 'm-home',
template: '<div>Welcome</div>',
)
class HomeComponent {}
此示例允许您仅在当前正在查看GeneralComponent
加载SecretComponent
,否则不加载。
在AngularDart 5上你可以这样做:
class MyComponent implements CanActivate {
@override
Future<bool> canActivate(RouterState current, RouterState next) {
return Future(() => isLoggedIn);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.