Необходимо скрыть ссылку в меню на основе "routerLink" после проверки доступа ACL. Я не хочу использовать угловые директивы "*ngIf" для каждой ссылки на элемент в приложении (необходимо сделать это глобально в определении routerConfig)
Контентом можно управлять с помощью аннотации @CanActivate на компонентах, но необходимо скрыть ссылку в меню
Я пытаюсь сделать это с помощью директивы "routerLink", но в этой директиве после перезаписи не удается получить доступ к моему параметру расширения, определенному (ресурсы и привилегии) в routerConfig.
Пример:
@Component({})
@RouteConfig([{
path: '/dashboard',
name: 'Dashboard',
component: DashboardComponent,
data: {'resource':'account', 'privilage':'show'}
}])
Но не могу получить доступ к этим данным конфигурации (routerData) в «routerLink».
Некоторая идея, как это сделать?
Вторая версия
Многоуровневое меню и stiil имеют проблемы с получением доступа к (расширенной конфигурации данных) из определения routerConfig.
Главный компонент
@RouteConfig([
{ path:'/dashboard', name: 'DashboardLink', component: DashboardComponent, data: { res: 'dasboard', priv: 'show'}, useAsDefault: true },
{ path:'/user/...', name: 'UserLink', component: UserComponent, data: { res: 'user', priv: 'show'} },
])
@Component({
selector: 'main-app',
template: `
<ul class="left-menu">
<li><a secured [routerLink]="['UserLink']">User</a>
<ul>
<li><a secured [routerLink]="['ProfileLink']">Profile</a></li>
</ul>
</li>
<li><a secured [routerLink]="['HomeLink']">Home</a></li>
<li><a secured [routerLink]="['DashboardLink']">Dashboard</a></li>
</ul>
<router-outlet></router-outlet>
`
})
export class MainComponent {
}
Пользовательский компонент
@RouteConfig([
{ path: '/profile', name: 'ProfileLink', component: ProfileComponent, data: {res: 'user', priv: 'details'} },
])
@Component({ ... })
export class UserComponent {
}
Компонент профиля
@Component({ ... })
export class ProfileComponent {
}
Мои безопасные директивы
@Directive({
selector: '[secured]'
})
export class SecuredDirective {
@Input('routerLink')
routeParams: any[];
/**
*
*/
constructor(private _viewContainer: ViewContainerRef, private _elementRef: ElementRef, private router:Router) {
}
ngAfterViewInit(){
//Get access to the directives element router instructions (with parent instructions)
let instruction = this.router.generate(this.routeParams);
//Find last child element od instruction - I thing thats my component but I am not sure (work good with two levels of menu)
this.getRouterChild(instruction);
}
private getRouterChild(obj: any){
var obj1 = obj;
while(true) {
if( typeof obj1.child !== 'undefined' && obj1.child !== null ){
obj1 = obj1.child;
} else {
break;
}
}
this.checkResPrivAcl(obj1.component.routeData.data)
}
private checkResPrivAcl(aclResAndPriv: any){
let hasAccess = CommonAclService.getInstance().hasAccess(aclResAndPriv['res'], aclResAndPriv['priv']);
if (!hasAccess) {
let el : HTMLElement = this._elementRef.nativeElement;
el.parentNode.removeChild(el);
}
console.log("CHECK ACL: " + aclResAndPriv['res'] + " | " + aclResAndPriv['priv']);
}
}
Это решение работает только для дочернего элемента меню, не работает с основным уровнем меню, и не уверен, что это работает правильно в многоуровневом меню.
Я пытаюсь решить эту проблему другим способом. Я пытаюсь получить доступ к определению RouterConfig (и моей конфигурации расширения routerData) в директивах и проверить элемент по псевдониму ссылки, используя @Input('routerLink') но не нашел, как мне получить доступ к RouterConfig.
check access
? - person micronyks   schedule 16.03.2016