Как создать админ-панель для проекта Angular Universal? - PullRequest
Новая
       109

Как создать админ-панель для проекта Angular Universal?

1 голос
/ 06 ноября 2019

В настоящее время у меня есть проект Angular Universal, который прекрасно работает. Из-за потребностей SEO меня попросили внедрить админ-панель для этого проекта, где они смогут самостоятельно обновлять текстовое содержимое.

Причина, по которой я здесь, заключается в том, что мне нужно реализовать это при сохранении функциональности SSR, а это означает, что если я отправлю запрос GET на одну из моих страниц, я хочу, чтобы он отображал весь текст, включая динамический, который я 'Позвольте им редактировать. По вышеуказанной причине у меня не может быть простого API, который я буду вызывать из клиентской части, поскольку он не будет работать без реального запуска приложения. Моя идея состояла в том, чтобы ПОЛУЧИТЬ все динамические данные на сервере server.ts приложения и каким-то образом внедрить их в клиентскую часть, таким образом я сохраню все преимущества ССО в SEO.

Вопрос в том,Как бы я внедрить все данные из server.ts? Попытался найти решение в Google, и единственный подход, который я нашел, - это добавить провайдеров в пример app.engine - 

app.engine('html', ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,
  providers: [
    provideModuleMap(LAZY_MODULE_MAP),
    { provide: 'dynamicContent1', useFactory: () => "some dynamic data I'll GET from the db prior to this line of code." },
    { provide: 'dynamicContent2', useFactory: () => "some dynamic data I'll GET from the db prior to this line of code2." }    
  ]
}));

, а затем клиентская часть будет иметь вид - 

  title = "";
  constructor(private injector: Injector, @Inject(PLATFORM_ID) private platformId: Object) {
    if (isPlatformServer(this.platformId)) {
      this.title = this.injector.get('dynamicContent1');
    } else {
      console.log('we\'re rendering from the browser, so there is no request object.');
    }
  }

. Выше я думал, что смогу получить доступ к dynamicContent1 с клиента, используя SSR. Приведенный выше пример не работает и выдает - 

Error: StaticInjectorError[{provide:"dynamicContent1", useFactory:useFactory}]: 'deps' required

не может найти ответ на эту проблему ... в любом случае, я не уверен, что это даже правильный подход.

Будетлюбите несколько советов о том, как я должен подойти к этому? Как получить данные до загрузки сайта и как внедрить их в клиент для сохранения функциональности SSR?

Спасибо!

...