2

私はウェブアプリケーションを持っています。右側のバーには 3 つの投稿があります。投稿をクリックすると、ナビゲーションがあります：

    this.router.navigate(['../post', this.post.id]);

ポストプロファイルコンポーネントが引き継ぎます。このコンポーネントには、指定された ID を持つ投稿を取得するサービスから関数を呼び出す関数があります。これで、その投稿のすべての詳細がコンテンツ エリア (画面の左側) に表示されます。この関数 (私の投稿を取得する) は、Post Profile コンポーネントの ngOnInit でのみ呼び出されます。

右側のサイド バーから別の投稿をクリックすると、URL の変更が表示されますが、投稿を取得する関数は呼び出されず、コンテンツ エリアの投稿の詳細は変更されません。ページを更新すると、必要な投稿が表示され、すべてうまくいきます。

それが役立つ場合は、関数に .subscribe があります。

問題がわかりません。

これは私の PostProfileComponent です

        constructor(postsService: PostsService, route: ActivatedRoute ) {
    this.postsService = postsService;

    this.routeSubscription = route.params
        .subscribe((params: any) => {
            this.postId = params['id'];
        });
}

public getPostById(id: any): void {
    this.postsService.getPostById(id)
        .map((response: Post) => {
            this.post = response;
            console.log(this.post);
        })
        .catch((error: any) => {
            return error;
        })
        .subscribe();
}

ngOnInit(): void {
    this.getPostById(this.postId);
}
4

1 に答える 1

1

Post Profile コンポーネントの ngOnInit メソッドで、ActivatedRoute paramsObservable をサブスクライブする必要があります。

  subs1: Subscription;
  constructor(private route: ActivatedRoute){}

  ngOnInit() {
     this.subs1 = this.route.params
         .subscribe((params: Params) => {
             const postId = params['id'] ? +params['id'] : '';
             if(postId){
                //  call the function (that gets the post)
             }
         });
  }
于 2017-10-07T16:48:33.217 に答える