Get updated data from service method Angular

Question

I have this service.

playerhandler.ts

import { Observable,of,Subject } from 'rxjs';
import { PlayerService } from "./../../core/services/player.service";
import { Injectable } from "@angular/core";
import { DeezerService } from "../services/deezer.service";
import { Track } from "../models/Track";

@Injectable({
  providedIn: "root"
})
export class PlayerHanlder {
  isPlaying: boolean = false;
  index: number;

  constructor(
    private playerService: PlayerService,
    private deezer: DeezerService
  ) { }

  initTracks(tracks): void {
    this.playerService.init(tracks);
  }

  play() {
    this.isPlaying = true;
    this.playerService.play();
  }

  pause() {
    this.playerService.pause();
  }

  stop() {
    this.playerService.stop();
  }

  next() {
    this.playerService.playNext();
  }

  previous() {
    this.playerService.playPrevious();
  }

  playing(playing) {
    this.isPlaying = playing;
  }

  onEnd() {
    this.playerService.playNext();
  }

  start(album) {
    if (this.isPlaying) this.stop();
    this.deezer.getTrackList(album.tracklist)
      .subscribe((tracks: Track[]) => {
        this.initTracks(tracks);
        this.playerService.index = 0;
        this.play();
      });
  }

  startSelectedTrack(tracks,trackIndex) {
    if (this.isPlaying) this.stop();

    this.initTracks(tracks);
    this.playerService.playNew(trackIndex);
    this.isPlaying = true;
  }
}

The initTracks(tracks) method gets a fresh data anytime a user clicks to play an album or clicks to play a particular track. This can be seen in the last two methods. Now, I have a queue component that is supposed to get the tracks data that is passed into the initTracks(tracks) method so that, the current playlist of tracks will be shown in the queue component. This is where I'm having the problem implementing. I have tried to create an observable of the tracks using of(tracks) in the initTracks method. That didn't work out. I've also tried using a Subject so that the tracks can be both subscribe and be subscribed but that also didn't work out. Please, how do I get any fresh data that is sent into the initTracks(tracks) method into the queue component. Thank you.

If needed, this is the current source code. source code

Vugar Abdullayev · Accepted Answer · 2018-08-10 15:44:34Z

1

Please use ReplaySubject and inform if helped. Can you post some example code where you emit data and subscribe?

answered Aug 10, 2018 at 15:44

Vugar Abdullayev

2,1513 gold badges24 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Alf Moh Over a year ago

Didn't work. The implementation I used for ReplaySubject is the same for Subject and of observable. Maybe I'm doing it wrong. This is the implementation. pastebin.com/cxer5zXM

Vugar Abdullayev Over a year ago

Please do the followings: 1. In initTracks console.log(tracks) before you emit them, be sure it exists. 2. change this.playerHanlder.tracks$.subscribe(t=>console.log(t)) to this.playerHanlder.tracks$.subscribe(t=>console.log(t), er => console.log(er)) . Maybe you have error.

Alf Moh Over a year ago

The tracks do exist. When I console log in the initTracks(tracks) method, I can see the tracks in the console.The problem is, it doesn't show in the queue component when I subscribe. Also, I just tried adding the second method in the subscribe function ( er => console.log(er)) but no error showed. When I click the button, nothing shows in the console.

Vugar Abdullayev Over a year ago

can you please post code to stackblitz. I do not see any other problem.

Alf Moh Over a year ago

This is the source code github.com/alfmoh/waless-spa . I tried putting it on stackbliz but received a lot of errors that is couldn't find the styling files.

Collectives™ on Stack Overflow

Get updated data from service method Angular

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related