Behaviorsubject not updating variable

A parent component contains a header component and content component. The header calls a behaviorsubject service to set a variable, and the content one should display the variable. This isn’t working (changing the variable via the header doesn’t update the variable in the content).

The filter service…

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

  providedIn: 'root'
export class FilterService {
  private filter:BehaviorSubject<string>;

  constructor() {
    this.filter = new BehaviorSubject<string>('');
  setFilter(flt: string): void
    console.log('filter set to ', flt);

    return this.filter.asObservable();

The header code …

// ... other stuff
import { FilterService } from '@app/services/filter/filter.service';
    private filterService: FilterService) { }

// Called when you set the value of the variable
  filter(flt: string)

the content file

import { FilterService } from '@app/services/filter/filter.service';
// ... other stuff

  public thefilter = '';

    private filterService: FilterService){}

  ngOnInit() {   
// this.thefilter doesn't update. Why???
// ...

Anything wrong with this code? Any suggestions?

mind throwing together a minimal project we can clone and test? Snippets don’t really tell the whole story