Angular 2 routing-deprecated:如何检测CanActivate?
问题描述:
我有一个装饰有@CanActivate
的组件。Angular 2 routing-deprecated:如何检测CanActivate?
@Component({
// ...
})
@CanActivate(() => false)
export class UserManagementComponent {
// ...
}
在我的导航菜单中,我想禁用或隐藏导航到此路线的链接。我会如何去做这件事? PS:我仍然使用不推荐的路由机制,而不是rc1版本。
答
如果您将@CanActivate(() => ...)
返回值的计算移到服务中,那么您可以从整个应用程序访问它。您可以创建一个指令并将其添加到注入服务的routerLink
,并在路线的条件返回false
时禁用routerLink
。
请参阅http://almerosteyn.com/2016/04/linkup-custom-control-to-ngcontrol-ngmodel关于如何在@CanActivate
中使用DI。
见Angular 2, disable routerLink和Angular2, what is the correct way to disable an anchor element?如何禁用routerLink
答
我相信有一个注入的服务是很长的路要走,因为如果你在任何时候需要路由到其他附加组件的组件,它会是多少更容易,而且您不必复制反射代码。
这就是说,我很好奇如何做反思的确。所以它似乎应该被添加到ES7规范。现在,“反射元数据”包pollyfills为它,这也是Angular2内部使用。虽然'Reflect'已经是TypeScript库的一部分,但我没有找到任何元数据反射,似乎它只支持对象反射。
//This is a bit hacky, but it might help.
...
export class Test {
...
logType(target : any, key : string) {
//stop TypeScript from mapping this to TypeScript Reflect.
var Reflect = Reflect || {};
//You still get an error if you havn't added the Reflect.js script in the page
var t = Reflect.getMetadata("design:type", target, key);
console.log('key:' + key + ' type: ' + t.name);
}
...
}
来源:
我想返回值并不总是静态'FALSE'而这只是这个例子?通常它是从一些条件计算出来的。 –
事实上,只是为了保持简单的例子。 – Aetherix