Você pode utilizar uma @Service com um BehaviorSubject. O BehaviorSubject contém o valor que precisa ser compartilhado com outros componentes, ele ao menos tempo é Observador e Observável o mesmo pode receber e emitir os valores atuais.
Você irá precisar uma Service com um atributo do tipo BehaviorSubject, no meu exemplo criei o mesmo com o tipo numero e um valor padrão 0, como abaixo:
@Injectable()
export class QuoteService {
public openQuotes = new BehaviorSubject<number>(0);
setOpenQuote(quotes : number){
this.openQuotes.next(quotes);
}
}
No componente da Table será o lugar onde irá pegar os dados, e enviá-los para o BehaviorSubject, então você precisa injetar a Service no componente da Table, e no método chamado pelo botão verde, você irá enviar os dados:
construtor(
quoteService : QuoteService
){}
acaoBotaoVerde(){
this.quoteService.setOpenQuote(quotesOpened);
}
E no componente de navegação você simplesmente irá fazer um subscribe para ficar monitorando caso as informações mudem:
construtor(
quoteService : QuoteService
){}
this.quotesOpen = this.quoteService.openQuotes.subscribe(
(quotes) => {
return quotes;
}
);
Claro, esse código pode ser otimizado, mas ajuda você ter uma ideia do que utilizar.
<router-outlet></router-outlet>
. Assim basta você usar EventEmitter pra notificar o componente pai sempre que algo acontecer no componente filho.