Как получить один комментарий для каждого сообщения в списке с помощью одной кнопки? - PullRequest
Новая
       14

Как получить один комментарий для каждого сообщения в списке с помощью одной кнопки?

0 голосов
/ 20 февраля 2019

API Wordress используется для получения постов и комментариев.HttpClient get метод используется для подключения к WordPress API.Две проблемы, которые у меня возникают, это получение только следующего комментария для следующего поста в списке, когда предыдущий был завершен, а вторая - способ отображения каждого уникального ответа (комментария) под каждым конкретным постом.Вот что у меня есть:

app.module.ts 

import { AppComponent } from './app.component';
import { PostsComponent } from './posts/posts.component';
import { CommentComponent } from './comment/comment.component';


@NgModule({
 declarations: [
    AppComponent,
    PostsComponent,
    CommentComponent
],
 imports: [
   BrowserModule,
   HttpClientModule
],
 providers: [ CommentComponent ],
 bootstrap: [AppComponent]
})

comment.component.ts 

export class CommentComponent implements OnInit {
@Input() post: Object
comment$: Object
constructor(private commentService: CommentService) { }

getCommentPost(posts) {
    this.commentService.setPosts(posts);
    this.commentService.getPostComment()
    .subscribe(
    comment => this.comment$ = comment,
    err => console.error('error: ', err),
    () => console.log('completed')
   )
}

comment.service.ts 

interface Comment {
   content: string,
   date: Date
}

interface Response {
   comments: Comment[]
}

interface post {
   ID: number,
   site_ID: number
}

@Injectable({
  providedIn: 'root'
})

export class CommentService {
  posts: post[]
  constructor(private http: HttpClient) { }

  setPosts(posts) {
      this.posts = posts;
      this.getPostComment();
  }

  getPostComment() {
      return this.http.get<Response>(`https://public-api.wordpress.com/rest/v1.1/sites/${this.posts[0].site_ID}/posts/${this.posts[0].ID}/replies?number=1`)
  .pipe(
    filter(data => data.comments.length !== 0),
    map(data => data.comments[0]),
    mergeMap((c) => this.http.get<Response>(`https://public-api.wordpress.com/rest/v1.1/sites/${this.posts[1].site_ID}/posts/${this.posts[1].ID}/replies?number=1`)),
    map(data => data.comments[1]),
    mergeMap((c) => this.http.get<Response>(`https://public-api.wordpress.com/rest/v1.1/sites/${this.posts[2].site_ID}/posts/${this.posts[2].ID}/replies?number=1`)),
    map(data => data.comments[2]),
    retry(3),
    shareReplay()
  )
 }   
}

в posts.component.html У меня 

<button (click)="comment.getCommentPost(posts$)">Get Comment per Post</button>

в comment.component.html У меня 

<div *ngIf="comment$ !== undefined">
    <p [innerHTML]="comment$.content">
    {{comment$.ID}}
    </p>
</div>

Я создал проект с помощью команды angular-cli.

...