Как скрыть ссылку администратора в представлении html. Я должен охранять: администратор и менеджер
Конфиг роутера:
{
path: 'manager',
component: ManagerComponent,
canActivate: [ManagerGuard]
},
{
path: 'user',
component: UserAdminComponent,
canActivate: [AdminGuard]
}
С учетом :
<li>
<a routerLink="/user" routerLinkActive="active-link">User</a>
</li>
Я хочу скрыть ссылку на /user для ManagerGuard, но показать ее для AdminGuard.
Кроме того, если я уже ответил таким образом, который может быть полезен, я использовал здесь другой подход. Поскольку у вас уже есть метод canActivate в Guard, вы также можете внедрить свой навигационный компонент с этим Guards и вызвать эти методы canActivate напрямую:
В вашем компоненте, который содержит навигацию
constructor(private adminGuard: AdminGuard)
а потом в шаблоне
<li *ngIf="adminGuard.canActivate()">
<a routerLink="/user" routerLinkActive="active-link">User</a>
</li>
Изменить
В моем случае это не работает в режиме prod (если вы используете параметры, которые необходимо вводить). Я только что попытался скомпилировать его, но angular жалуется на отсутствующие параметры. Если вы не используете параметры, это работает нормально, или, если вы не используете параметры в своей функции, то просто проходите
<li *ngIf="adminGuard.canActivate(null,null)">
<a routerLink="/user" routerLinkActive="active-link">User</a>
</li>
Еще одно: если в шаблоне есть такие переменные, как «adminGuard» выше, они должны быть общедоступными, а не частными.
На мой взгляд, это никак не связано с самим роутером.
Ваши Guards могут вызывать другую службу, у которой есть информация о том, какой пользователь вошел в систему: Admin или Manager.
Вы должны создать службу, которая знает тип пользователя. Затем внедрите этот сервис с помощью внедрения зависимостей в свой компонент, где у вас есть routerLink.
Там вы можете задать сервис и переключить ссылку с *ngIf:
<li *ngIf="myService.getCurrentUser().isAdmin()">
<a routerLink="/user" routerLinkActive="active-link">User</a>
</li>
Таким образом, служба предоставляет функцию, которая дает вам пользователя, который в данный момент вошел в систему, а isAdmin()-функция пользователя возвращает true или false. Если пользователь является администратором, то будет отображаться <li>, в противном случае он будет скрыт.
Это всего лишь пример, но я надеюсь, что вы поняли суть. Это больше связано с базовой функциональностью Angular 2, чем с маршрутизатором Angular 2. Дополнительную информацию о *ngIf можно найти здесь.
