Как я могу использовать RxJS BehaviorSubject для обмена числами между компонентами вместо строк - PullRequest
0 голосов
/ 06 мая 2019

Я следую этому уроку:

https://angularfirebase.com/lessons/sharing-data-between-angular-components-four-methods/#sibling-component-ts

Чтобы попытаться установить связь между двумя компонентами.
После этого урока мне удалось передать строки только между компонентами.

Это parent-of-sibling.component.ts

import { Component, OnInit } from '@angular/core';
import { DataService } from "../data.service";
@Component({
  selector: 'app-parent-of-sibling',
  template: `
  <br>
  Here's the received message from sibling
  <br>

  {{message}}
  <br>

`,  styleUrls: ['./parent-of-sibling.component.css']
})
export class ParentOfSiblingComponent implements OnInit {

  message:string;

  constructor(private data: DataService) { }

  ngOnInit() {
    this.data.currentMessage.subscribe(message => this.message = message)
  }

}

Это sibling.component.ts:

import { Component, OnInit } from '@angular/core';
import { DataService } from "../data.service";

@Component({
  selector: 'app-sibling',
  template: `
  <button (click)="newMessage()">Send message to parent</button>
`,  styleUrls: ['./sibling.component.css']
})
export class SiblingComponent implements OnInit {

  message:string;

  constructor(private data: DataService) { }

  ngOnInit() {
  }

  newMessage() {
    this.data.changeMessage("MESSAGE RECEIVED FROM SIBLING")
  }

}

И, наконец, это data.service.ts:

import { Injectable } from '@angular/core';
import { BehaviorSubject } from 'rxjs';

@Injectable()
export class DataService {

  private messageSource = new BehaviorSubject('default message');
  currentMessage = this.messageSource.asObservable();

  constructor() { }

  changeMessage(message: string) {
    this.messageSource.next(message);
  }

}

Это прекрасно работает, если я передаю строку:
enter image description here enter image description here
Когда я пытался сообщить номер, используя тот же код, приложение выдает ошибку.
Итак, вот мои вопросы:
1 / Что является причиной ошибки? (И.Е .: Я знаю, что этот код работает для строк, а не чисел, но почему он работает только для строк?)
2 / Есть ли способ это исправить?
Спасибо!

1 Ответ

0 голосов
/ 06 мая 2019

Благодаря подсказке @Buczkowski я решил проблему.

export class DataService {
  private messageSource = new BehaviorSubject<Number>(4);
  currentMessage = this.messageSource.asObservable();
  constructor() { }
  changeMessage(message: Number) {
    this.messageSource.next(message);
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...