combined with Rxjs , the value of the drop-down list is placed in the common service as a BehaviorSubject , and the async pipe parsing value is directly used on the subcomponent template.
example (service): of common components

<del></del><br>
@Injectable()
class CustomService{
    public customAttr:number=0;
    constructor(){
        setInterval(()=>this.customAttr=Math.random(),1000);
    }
}
 dependency injection of this service in the component 
constructor(public customService:CustomService){}
 then in the html template, you can directly use the attribute values in the service to render 
.
<div>{{customService.customAttr}}</div>