Как изменить массив в BehaviourSubject?

Question

[enotiiik]

Есть два компонента. Задача первого отобразить массив и добавлять в него елементы (при нажатии на кнопку), второй должен просто отображать этот массив.
Код первого компонента:

export class MainComponent implements OnInit {

  posts!: Post[];
  constructor(
    private service: ExampleService,
  ) { }

  ngOnInit(): void {
    this.service.pubs.subscribe(p => this.posts = p);
  }

  add(): void {//привязаная к кнопке
    const npost: Post = {id: 10, text: 'hello'};
    this.service.pubs.pipe(map( p => p.unshift(npost)));
  }

Код второго елемента:

export class SecondcomponentComponent implements OnInit {
  
  posts!: Post[];
  constructor(
    private service: ExampleService,
  ) { }

  ngOnInit(): void {
    this.service.pubs.subscribe(p => this.posts = p);
  }
  
}

И есть сервис:

export class ExampleService {

  pubs: BehaviorSubject<Post[]> = new BehaviorSubject<Post[]> (Posts);
  constructor() { }
  
}

Как правильно добавить новый елемент в массив, что-бы он (массив), обновился на обоих компонентах?

Comments

[WbICHA]

А тс тут причём?

Answer 1

[Lan_ser]

В сервисе
private postSource: BehaviorSubject= new BehaviorSubject(Posts)
newPost = this.postSource.asObservable(); - метод вернет объект с методами подписки на событие.
создаем метод
emitNewPost(el: number) {
// добавь логику добавления элемента в массив
this.postSource.next(post ) - уведомит все подписанные компоненты
}

в первой компоненте
add(){
this.server.emitNewPost(post) - вызываем emitNewTask, передаем даные
}

во второй
this.service.pubs.subscribe(p => this.posts = p);