Загрузите компонент, указанный в качестве параметра URL-запроса, в приложении Angular, размещенном в AWS S3 - PullRequest
Новая
       15

Загрузите компонент, указанный в качестве параметра URL-запроса, в приложении Angular, размещенном в AWS S3

0 голосов
/ 15 марта 2019

У меня есть приложение Angular, размещенное в корзине AWS S3, назовем его myBucket .Насколько я понимаю, это означает, что я могу получить доступ к приложению, используя только URL http:\\myBucket.Если я пытаюсь что-то наподобие http:\\myBucket\myPage, это не получается.

Мое приложение использует router-outlet для навигации по страницам.

Чтобы преодолеть тот факт, что я не могу использовать URL-адрес, такой как http:\\myBucket\myPageЯ хотел бы передать параметр в URL, чтобы я мог указать, какой из компонентов будет первым в router-outlet.Например, http:\\myBucket\?nextPage='myPage' будет загружать маршрут с пометкой «myPage» в конфигурации router.

Для этого в AppComponent я написал следующую логику 

constructor(
    private router: Router,
    private activatedRoute: ActivatedRoute,
  ) {}

ngOnInit() {
    this.activatedRoute.queryParams
    .subscribe(
      params => {
        console.log('params', params);
        if (params.nextPage) {
          this.router.navigate([params.nextPage]);
        } else {
          this.router.navigate(['defaultPage']);
        }
      }
    );
  }

К сожалению, если я так делаю, я всегда заканчиваю страницу по умолчанию, так как activatedRoute.queryParams сначала выдает всегда пустой объект, что приводит меня к defaultPage.Когда я перехожу на defaultPage, это слишком поздно, чтобы подвести мое приложение к тому, что он содержит в параметре nextPage.

Можно ли найти способ загрузки страницы / компонента, указанного в параметре URL-запроса

1 Ответ

0 голосов
/ 17 марта 2019

Я думаю, что столкнулся с «особенностью» Angular Router, которая не позволяет мне делать то, что я хочу (см. Этот журнал проблем ).В принципе, невозможно решить, что делать в зависимости от наличия или отсутствия параметра запроса при запуске приложения.

Так что в конце концов, ngOnInit из AppComponent, я взломал что-то подобное, чтобы перейти на страницуЯ хочу достичь в случае отсутствия параметров запроса 

 ngOnInit() {
    // start of hack
    const href = window.location.href;
    const queryParamIndex = href.indexOf('?');
    if (queryParamIndex === -1) {
      this.router.navigate(['defaultPage']);
    }
    // end of hack

    this.route.queryParamMap
      .pipe(
        // the first value emitted is always {} - see https://github.com/angular/angular/issues/12157
        skip(1),
        // take only the first one to avoid considering the empty objects that
        // the activatedRoute emits when it navigates to other routes
        take(1)
      )
      .subscribe(
        paramMap => {
          this.router.navigate([paramMap.get('nextPage)]);
        }
      );
  }
...