Нужна помощь в доступе к переменной из службы в Angular 2

Question

Передача идентификатора URL с последней страницы, на которой был пользователь, в службу, на которую я могу ссылаться в диалоговом окне.

isser.service.ts

import { Injectable, EventEmitter } from '@angular/core';
import { Observable, of } from 'rxjs';
import { BehaviorSubject } from 'rxjs';

@Injectable()
export class IssuerService {


private urlidSource = new BehaviorSubject<string>('');
currentUrlid = this.urlidSource.asObservable();
public onChange: EventEmitter<string> = new EventEmitter<string>();

  constructor () {
  }

  changeUrlid(urlid: string) {
    this.currentUrlid = of(urlid);
    this.onChange.emit(urlid);
  }

  getUrlid(currentUrlid: string) {
    return this.currentUrlid;
  }


}

Страница с желаемым URL-адресом (dashboard.component.ts)

import { IssuerService } from './../../issuer.service';
import { ActivatedRoute } from '@angular/router';
import { Router } from '@angular/router';
urlid: string;
  constructor(
    private route: ActivatedRoute,
    private router: Router,
    private issuerService: IssuerService,
    public dialog: MatDialog
  ) {}

newUrlid() {
  this.issuerService.changeUrlid(this.route.snapshot.paramMap.get('id'));
  console.log(this.urlid);
}

  ngOnInit() {
    // Get URL ID
    this.issuerService.onChange.subscribe(urlid => this.urlid = urlid);
    this.newUrlid();
}

Компонент Я хочу прочитать значение в:

    import { ActivatedRoute } from '@angular/router';
    import { Router } from '@angular/router';
    import { IssuerService } from './../../issuer.service';

        urlid: string;

        constructor(
          private route: ActivatedRoute,
          private router: Router,
          private issuerService: IssuerService,
          public dialog: MatDialog
        ) {}

  ngOnInit() {
 this.issuerService.onChange.subscribe(urlid => {
           this.urlid = urlid;
           console.log(this.urlid);
   });

  }

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

Answer 1

вы можете увидеть этот пример , и его модифицированный список:

• использовать queryPamas для получения строки запроса, а не params (DashboardComponent)

• используйте ReplaySubject (1), чтобы вернуть последний urlId;у него нет значения по умолчанию, просто верните prev one value (IssuerService)

• получите наблюдаемый из getUrlid и подпишите его в компонентах, которые хотят показать url id

export class IssuerService {


  private urlidSource = new ReplaySubject<string>(1);

  constructor() {
  }

  changeUrlid(urlid: string) {
    this.urlidSource.next(urlid);
  }

  getUrlid() {
    return this.urlidSource;
  }

}

export class DashboardComponent implements OnInit {

  urlid: string;
  constructor(
    // private route: ActivatedRoute,
    private router: Router,
    private issuerService: IssuerService,
    // public dialog: MatDialog
  ) { }

  newUrlid() {
    // Get URL ID
    this.route.queryParams.subscribe((queryParam) => {
      const id = queryParam['id'];
      if (!id) {
        return;
      }
      this.issuerService.changeUrlid(id);
    });
  }

  ngOnInit() {
    this.newUrlid();

    this.issuerService.getUrlid().subscribe(urlid => {
      this.urlid = urlid;
    });
  }

}

export class HelloComponent implements OnInit {
  urlid;
  constructor(
    private issuerService: IssuerService
  ) { }

  ngOnInit() {
    this.issuerService.getUrlid().subscribe(urlid => {
      this.urlid = urlid;
    });
  }
}

Answer 2

Вам не нужен параметр для вашего метода get, поскольку у вас уже есть значение внутри службы,

  getUrlid() {
    return this.currentUrlid;
  }

, и вы можете использовать извлечение значения во 2-м компоненте следующим образом:

this.issuerService.currentUrlid.subscribe((value: string) => {
         this.urlid = value;
}