Angular2: ленивая загрузка без маршрутизации и динамической загрузки
Я использую mgechev angular2 для моего проекта. Я работаю над angular2 за последние 6 месяцев (по всему миру со всеми RC до финального выпуска). Я застрял с требованием моего клиента. Жаль, что вы, ребята, не смогли помочь.
Вот проблема. Основы на роли пользователя:
ROLE_ADMIN
ROLE_REVIEWER
Веб-приложение должно иметь возможность загружать определенные модули и отображать их. Скажем,
- если роль пользователя
ROLE_ADMIN
, затем загрузите angular2 модули Module1
&
Module2
- если роль пользователя
ROLE_REVIEWER
, затем загрузите модули angular2
Module1
.
Когда я говорю "load", это означает, что он должен извлекать файлы модулей (все, что связано с модулем) с сервера, вставлять в приложение angular2 и отображать этот модуль.
Итак, если роль пользователя ROLE_REVIEWER
, я смогу увидеть только Module1
, что означает, что Module2
не должно быть даже выбрано с сервера.
ИЗМЕНИТЬ
Здесь сложная часть, url не изменяется при этом. Рассмотрим этот модуль как виджеты, которые загружаются на панели управления /dashboard
. Таким образом, при загрузке этих модулей не ожидается изменение url.
Надеюсь, мой вопрос достаточно объяснительный. Пожалуйста, предложите мне все, что я должен сделать, или исследовать или изучить, чтобы достичь этого.
Мое лучшее предположение, я должен сделать следующее:
- Условная ленивая загрузка (без маршрутизации), а затем
- Динамическая загрузка
Но я не знаю, как.
Ответы
Ответ 1
Вам нужно использовать маршрутизацию и ленивую загрузку.
Стратегия, которую я использую, - это динамически настроить маршрутизатор на основе роли.
Надеюсь, это поможет
ПОСЛЕ ЧТЕНИЯ ИЗОБРАЖЕНИЯ
После прочтения вашего редактирования, я понимаю, что со словом "модуль" вы определяете серию виджетов, которые ограничены или не зависят от роли. В таком случае вам не нужна маршрутизация и ленивая загрузка. Это всего лишь условная логика, которую вы можете закодировать в шаблоне компонента "панель инструментов", используя * ngIf.
Я предлагаю не использовать слово "модуль" в этом смысле. Модуль используется либо в смысле EC6, либо в значении Angular2.
В первом случае это связано с концепцией "импорт" / "экспорт". Во втором случае это связано с ленивой загрузкой и маршрутизацией.
Я надеюсь, что это поможет
Ответ 2
- У ROLE глобальная переменная
- при ленивой загрузке имеют условное разрешение.
{
path: "dashboard",
loadChildren: () => new Promise(function (resolve) {
(require as any).ensure([], function (require: any) {
if (ROLE === 'admin')
resolve(require('./admin.module')['AdminModule']);
if (ROLE === 'reviewer')
resolve(require('./reviewer.module')['ReviewerModule']);
resolve(require('./user.module')['UserModule']); //default module
});
})
}
- Импортировать модуль1 и module2 в модуль ADMIN и импортировать модуль1 в ReviewerModule