Блог

У меня есть проблема с тем, как реализовать меню с различными опциями, основанными на правах пользователя (которые передаются через API)

т. е. пользователь «Базовый пользователь» может видеть компонент «мой профиль», компонент «новости», компонент «поиск», а пользователь «Администратор» может видеть, что может «Базовый пользователь», но также может видеть компонент «мои сотрудники», который принимает меня все остальные «Базовые пользователи»

пример ответа

 {
    "name": "admin",
    "avatar": "someRandomAvatar",
    "navigationItems" : [
        "navigationItem": {
            "id":0,
            "name":"my profile",
            "url":"http://localhost:8090/@self"
        },
        "navigationItem": {
            "id":1,
            "name":"Lastest News",
            "url":"http://localhost:8090/news"
        },
        "navigationItem": {
            "id":2,
            "name":"search",
            "url":"http://localhost:8090/search/"
        },
        "navigationItem": {
            "id":3,
            "name":"my employees",
            "url":"http://localhost:8090/employee/all"
        }
    ] 
}
 

у администратора будет ответ, у Id :3 обычного пользователя его не будет
Теперь, основываясь на этом ответе, мне нужно будет отобразить список меню на интерфейсе
, каждый объект из массива будет отображаться одинаково (*ngFor позволяет navigationItem в navigationItems).
щелчок по пункту меню введет мне другой компонент в DOM
Я думаю выбрать нужный компонент на основе идентификатора, но открыт для предложений
, и каждый компонент будет иметь другой дизайн

может ли кто-нибудь помочь мне с идеей или некоторой информацией о том, как лучше всего это сделать? достаточно ли хорош компонент функций? Спасибо!