Angular 5 с несколькими модулями и Sharepoint SPFX - PullRequest
Новая
       15

Angular 5 с несколькими модулями и Sharepoint SPFX

0 голосов
/ 03 мая 2019

Я использую Angular 5 для запуска приложения внутри решения SPFX, но мое приложение не запускает некоторые базовые угловые события, такие как onInit, или даже набор @Input не работает.

Единственный модуль и компоненты, которые работают должным образом, это те, которые запускаются app.component и app.module.Для всех остальных модулей запускается только конструктор, но все остальные события Angular Lifecycle не запускаются.

Вот мой app.webpart.ts: 

export default class HelloWorldWebPart extends BaseClientSideWebPart<IHelloAngularWebPartProps> {
  constructor() {
    super();
  }
  ngElement: HTMLElement;

  public render(): void {
    window['webPartContext'] = this.context;

    this.domElement.innerHTML = `<app-root [isOnline]='false'></app-root>`;

    platformBrowserDynamic().bootstrapModuleFactory(
      AppModuleNgFactory, { ngZone: 'noop' })
      .catch(
        err => console.log('error', err)
      );
  }

и мое приложение.module 

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    CoreModule,
    TrackersModule,
    LocalStorageModule.withConfig({
      prefix: 'my-app',
      storageType: 'localStorage',
    }),
    RouterModule.forRoot(ROUTES, { useHash: true, preloadingStrategy: PreloadAllModules })
  ],
  providers: [
    BackendRequestClass,
    {
      provide: APP_INITIALIZER, useFactory: (config: BackendRequestClass) => () => config.load(),
      deps: [BackendRequestClass], multi: true
    },
  ],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor() { }
}

Я предполагаю, что проблема связана с тем, как приложение запускается из веб-части, поэтому я попытался запустить приложение, используя boostrapModule вместо bootstrapModuleFactory.Но я даже не уверен, что это правильный способ загрузить все мои модули из app.module. 

platformBrowserDynamic().bootstrapModule(AppModule, {
    ngZone: 'noop'
  }).catch(err => console.log(err));

Но когда я запускаю это, я получаю эту ошибку:

Отклонение обещания: для 'AppModule' не найдено метаданных NgModule.;Зона:;Задача: Promise.then;Значение: ошибка: метаданные NgModule для 'AppModule' не найдены.

1 Ответ

0 голосов
/ 03 мая 2019

Чтобы убедиться, что JS не является родным для SharePoint, мешающим вашему угловому приложению, запустите ваше угловое приложение в редакторе контента. Вы можете настроить угловую сборку так, чтобы в ней был URL-адрес развертывания папки ресурсов, в которой вы храните файлы сборки. Затем вы указываете редактору содержимого на расположение файлов index.html.

Если приложение показывает аналогичные проблемы при запуске из редактора контента, может быть лучше проверить присутствующие полифиллы, чтобы убедиться, что они не связываются с собственным JS SharePoint. Я знаю, что core-js / es6 / string polyfills плохо работает в SharePoint.

Третья рекомендация - использовать Content Editors поверх SPFx при использовании Angular. Фреймворка SPFx просто еще нет.

См. Сообщение в блоге SPJeffs для подробностей. https://www.spjeff.com/2017/05/31/angular-cli-todo-list-in-sharepoint-content-editor/

...