Сохранять данные «Мне нравится» в записи в базе данных с отметкой Angular

Question

Вот проблема: у меня есть небольшое приложение, подключенное к firebase. Это пост приложение, как Facebook. Все работает отлично, за исключением постоянства лайков, которые я не могу понять, как я это сделаю. Я попробовал множество решений, поверьте мне, но результат не такой, как я ожидал

HTML компонента Post:

<div class="container">
  <div class="row">
    <div class="col-md-12">
      <form [formGroup]="postForm" (ngSubmit)="onSubmit()">
        <div class="row">
          <div class="col-md-6 offset-md-3">
            <mat-form-field class="full-width">
              <mat-label>Title</mat-label>
              <input formControlName="title" matInput />
            </mat-form-field>
          </div>
        </div>
        <div class="row">
          <div class="col md 12">
            <mat-form-field class="full-width">
              <mat-label>Body</mat-label>
              <textarea matInput
            cdkTextareaAutosize
            formControlName="body"
            #autosize="cdkTextareaAutosize"
            cdkAutosizeMinRows="1"
            cdkAutosizeMaxRows="5"></textarea>
            </mat-form-field>
            <button color="accent" mat-raised-button type="submit">Post</button>
          </div>
        </div>
      </form>
    </div>
  </div>
  <div class="row">
    <div class="col-md-6">

      <mat-list role="list" *ngFor="let post of posts">

        <mat-list-item role="listitem">{{post.title}}</mat-list-item>
        <mat-list-item role="listitem">{{post.body}}  <app-like (change)="receiver($event)"></app-like></mat-list-item>
        <mat-list-item role="listitem">{{post.userId}}</mat-list-item>
      </mat-list>


    </div>
  </div>
</div>

TS сообщения:

constructor(private afAuth: AngularFireAuth, private fb: FormBuilder, private postService: PostService, private authService: AuthService) {
    this.afAuth.authState.subscribe(user => {
      if (user)
        this.userId = user.uid;
    });
  }

  ngOnInit() {
    this.postSubscription = this.postService.getAll().valueChanges().subscribe(post => {
      this.posts = post;
    })
    this.postService.getLike().valueChanges().subscribe(data=>{
      this.likes=data;
    })
    this.postForm = this.fb.group({
      title: ['', Validators.required],
      body: ['', Validators.required]
    });
  }
  get title() { return this.postForm.get('title') }
  get body() { return this.postForm.get('body') }

  onSubmit() {
    let post: Post = {
      title: this.title.value,
      body: this.body.value,
      userId: this.userId   }
    this.postService.createPost(post)
  }

  receiver(event) {
    this.received=event

  }

И HTML как компонент:

<button color="accent" mat-raised-button (click)="increase()">Like</button>
<div>{{plus}}</div>

TS:

 plus: any;
  @Output() change = new EventEmitter()
  constructor(private postService: PostService) { }

  ngOnInit() {
    this.postService.getLike().valueChanges().subscribe(data=>{
      this.plus=data
    })
  }


  increase() {
    this.change.emit({
      likes: this.plus++
    });
    this.postService.createlike(this.plus)

  }

Наконец, услуга:

  createPost(post) {
    return this.db.list('/posts').push(post)
  }

createlike(like){
  return this.db.list('/likes').push(like)
}
getLike(){
  return this.db.list('/likes')
}
  getAll(): AngularFireList<Post[]> {
    return this.db.list<Post[]>('/posts');
  }
}

Как вы видите, я даже создал отдельную коллекцию для лайков, но я думаю, что это неправильно, результат странный. Я просто хочу лайки рядом с телом поста. Может кто-нибудь дать мне подсказку?