从angular6的Firebase获取帖子详细信息页面中的帖子数据

Question

我创建了一个Angular项目。

myworkpage.service.ts `

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
@Injectable({
  providedIn: 'root'
})
export class MyworkService {
constructor(private http: HttpClient) {}

getposts(){
    return this.http.get('https://aviico-e1a0f.firebaseio.com/add-breeds.json')
  }
}

myworkpage.component.ts

import { Component, OnInit } from '@angular/core';
import { MyworkService } from '../../mywork.service';
@Component({
  selector: 'app-myworkpage',
  templateUrl: './myworkpage.component.html',
  styleUrls: ['./myworkpage.component.css']
})

export class MyworkpageComponent implements OnInit {
posts: any;
constructor( private data: MyworkService) {}
  ngOnInit() {
this.data.getposts().subscribe(
  data => this.posts = data
)}}

myworkpage.components.html

<div class="worklist">
<ul>
    <li *ngFor="let post of posts" class="product" class="{{post.class}}">
      <div class="img-part">
         <img src="{{post.img}}" alt="">
            <div class="overlay">
              <button routerLink="/mywork/{{post.id}}" class="btn">Read More</button>
            </div> 
      </div>
   </li>
</ul>

这是我的文件。如何在不同的组件（例如myworkpagedetail.component

）中获取每个对象的数据

请帮助。