From f5cdd44439315da01cb40c310be7a10b7519fe2a Mon Sep 17 00:00:00 2001
From: Jeremie BRISON <ext.sopra.jbrison@grandlyon.com>
Date: Tue, 2 Mar 2021 17:46:01 +0100
Subject: [PATCH] feat(post) : add service + logic call api + display post
details
---
.../post-card/post-card.component.ts | 2 +-
.../post-details/post-details.component.html | 6 ++++-
.../post-details/post-details.component.ts | 23 +++++++++++++++----
src/app/post/models/post.model.ts | 4 ++++
src/app/post/services/post.service.ts | 7 ++++++
5 files changed, 35 insertions(+), 7 deletions(-)
diff --git a/src/app/post/components/post-card/post-card.component.ts b/src/app/post/components/post-card/post-card.component.ts
index 24d4c1787..b571eff00 100644
--- a/src/app/post/components/post-card/post-card.component.ts
+++ b/src/app/post/components/post-card/post-card.component.ts
@@ -37,6 +37,6 @@ export class PostCardComponent implements OnInit {
}
}
public showDetails(post: Post): void {
- this.router.navigateByUrl('posts/details/' + post.id);
+ this.router.navigateByUrl('posts/details/' + post.id, { state: { data: post } });
}
}
diff --git a/src/app/post/components/post-details/post-details.component.html b/src/app/post/components/post-details/post-details.component.html
index 11f24be81..4f39ba1e6 100644
--- a/src/app/post/components/post-details/post-details.component.html
+++ b/src/app/post/components/post-details/post-details.component.html
@@ -1 +1,5 @@
-<p>post-details works!</p>
+<div *ngIf="post">
+ <h2>{{ post.title }}</h2>
+</div>
+
+<button (click)="backToPosts()">Retour</button>
diff --git a/src/app/post/components/post-details/post-details.component.ts b/src/app/post/components/post-details/post-details.component.ts
index 4cfba29e6..ce30a2537 100644
--- a/src/app/post/components/post-details/post-details.component.ts
+++ b/src/app/post/components/post-details/post-details.component.ts
@@ -1,5 +1,7 @@
import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
+import { Post } from '../../models/post.model';
+import { PostService } from '../../services/post.service';
@Component({
selector: 'app-post-details',
@@ -7,10 +9,21 @@ import { ActivatedRoute } from '@angular/router';
styleUrls: ['./post-details.component.scss'],
})
export class PostDetailsComponent implements OnInit {
- constructor(private activatedRoute: ActivatedRoute) {}
- postId: string;
+ constructor(private activatedRoute: ActivatedRoute, private router: Router, private postService: PostService) {}
+ post: Post;
ngOnInit(): void {
- this.postId = this.activatedRoute.snapshot.paramMap.get('id');
- console.log(this.postId);
+ if (history.state.data) {
+ this.post = new Post(history.state.data);
+ } else {
+ const postId = this.activatedRoute.snapshot.paramMap.get('id');
+ this.postService.getPost(postId).subscribe((post) => {
+ this.post = post.posts[0];
+ console.log(this.post);
+ });
+ }
+ }
+
+ public backToPosts(): void {
+ this.router.navigateByUrl('/posts');
}
}
diff --git a/src/app/post/models/post.model.ts b/src/app/post/models/post.model.ts
index 53efadc33..604f43995 100644
--- a/src/app/post/models/post.model.ts
+++ b/src/app/post/models/post.model.ts
@@ -9,4 +9,8 @@ export class Post {
html: string;
author: string;
tags: Tag[];
+
+ constructor(obj?: any) {
+ Object.assign(this, obj);
+ }
}
diff --git a/src/app/post/services/post.service.ts b/src/app/post/services/post.service.ts
index 848e6a58e..c5f3841bc 100644
--- a/src/app/post/services/post.service.ts
+++ b/src/app/post/services/post.service.ts
@@ -2,6 +2,7 @@ import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { map } from 'rxjs/operators';
+import { Post } from '../models/post.model';
import { PostWithMeta } from '../models/postWithMeta.model';
@Injectable({
@@ -11,6 +12,12 @@ export class PostService {
private readonly baseUrl = 'api/posts';
constructor(private http: HttpClient) {}
+ public getPost(idPost: string): Observable<PostWithMeta> {
+ return this.http
+ .get<PostWithMeta>(`${this.baseUrl}/` + idPost)
+ .pipe(map((item: PostWithMeta) => new PostWithMeta(item)));
+ }
+
public getPosts(tags?: string[]): Observable<PostWithMeta> {
if (!tags) {
return this.http
--
GitLab