1

次のように 2 つのルート パラメータを提供するページに移動しようとしています。

author/journals/:journal_Id/draftArticles/:articleId

ルートパラメーターがルートの最後にある場合、2つのパラメーターを指定できることを知っていますauthor/journals/draftArticles/:journal_Id/:articleId, journal_Id, articleId。これにより、おそらく問題が解決します。しかし、私が試みている構造を維持したかったのです。

path: 'author',
        canActivate: [AuthGuardService],
        canActivateChild: [AuthorGuard],
        component: AuthorNavComponent,
        children: [
          {
            path: '',
            component: AuthorDashboardComponent,
            pathMatch: 'full'
          },
          {
            path: 'profile',
            component: AuthorProfileComponent,
            pathMatch: 'full'
          },
          {
            path: 'journals/:journal_Id',
            component: JournalPublicPageComponent,
            pathMatch: 'full',
            children: [
              {
                path: 'draftArticles', children: [
                  {
                    path: ':articleId',
                    component: DraftArticleComponent,
                    pathMatch: 'full'
                  },
                  {
                    path: '',
                    component: DraftArticlesComponent,
                    pathMatch: 'full'
                  }
                ]
              },
              {
                path: 'articles', children: [
                  {
                    path: '',
                    component: ArticlesComponent,
                    pathMatch: 'full'
                  },
                  {
                    path: ':articleId',
                    component: ArticleComponent,
                    pathMatch: 'full'
                  }
                ]
              }
            ]
          }

上記は私のルートの構造です。

AuthorNavComponent私のSidenavは、子ルートを表示するために別のルーターアウトレットも使用しています。私がクリックしているボタンは、最終的に serviceA のメソッドを呼び出す Sidenav 内にあり、サーバーへの呼び出しを行った後、上記の指定された URL、つまりhttps://localhost:4200/author/journals/:journal_Id/draftArticlesにリダイレクトします/:記事ID

さらに情報が必要な場合はお知らせください

アップデート

真ん中のサービスを使ってみて、移動先のルートに渡す をjournalService作成しました。BehaviorSubject<any[]>ルートが であるコンポーネントでauthor/journals/3、私はこれをサブスクライブしBehaviorSubject<any[]>、次のように相対的な ActivatedRoute を渡すこの BehaviorSubject の値を変更してナビゲートしました。

仕訳コンポーネント

this.js.navigateAgain.subscribe(data => {
      if (data) {
        this.router.navigate(data, {relativeTo: this.activatedRoute});
      }
    });

その他のコンポーネントの値を変更している場所からBehaviorSubject<any[]>

this.js.navigateAgain.next(['draftArticles', articleId]);

これを使用して更新 2 ルートを生成することもできます ->this.router.navigate(['author/journals', journalId, 'draftArticles', articleId]);しかし、それでも以下のエラーが持続します :(

上記の手法により、URL が完全に生成されました。しかし、私はまだ次のエラーが発生します:

エラー

上記のルーティングに何か問題があるようです。

4

1 に答える 1