Обновить представление в Angular6, когда мы устанавливаем переменную в функции подписки

Первый компонент, который отображает файл select html

Когда я нажимаю кнопку просмотра, я перенаправляюсь на другой компонент Fileselect component, который является вторым компонентом this.goto('fileselect');

Проблема в том, что когда я выбираю файл из файлового компонента, я должен отображать его в поле ввода первого компонента.

Когда я нажимаю кнопку «Выбрать класс», я вызываю функцию redirect ().

В компоненте выбора файла я использовал службу для передачи имени файла первому компоненту, как показано в приведенном ниже коде.

 redirect(){
  this._messageService.filter(this.selectedFile);
  this.router.navigateByUrl('');

}

И в первом компоненте, где мне нужно это имя файла, я подписался на функцию, как показано

ngOnInit() {
   this._messageService.listen().subscribe((m:any) => {
            this.fileName = m
            this.loadXMLasJSON()
            console.log(this.fileName)

});}

Я назначаю переменную this.fileName в функции подписки, когда я console.log получаю имя файла. Но вид не обновляется.

Мой код просмотра

 <input type="text"  class="form-control image-preview-filename" value="{{fileName}}" />

В чем может быть проблема?

Пожалуйста, помогите мне с этим.