Angular 2: снова загрузить компонент, включая templateUrl и styleUrls

Question

У меня есть Component, который имеет 2 "состояния просмотра" (вертикальное и горизонтальное).чтобы показать \ загрузить предпочтение пользователя, я проверяю значение статического логического свойства (AppService.IsVerticalView), которое находится в сервисе.это домашний компонент:

@Component({
    host: { '(document:scroll)': 'onScroll($event)' },
    selector: 'txt-zone',
    templateUrl:AppService.IsVerticalView  == false ? 'app/txtzone/Txtzone.component.html' : 'app/txtzone/Txtzone_vertical.component.html' ,
    styleUrls: [AppService.IsVerticalView   == false ? 'app/txtzone/TxtZone.css' : 'app/txtzone/txtZone_Vertical.css'],
})

Я изменяю значение AppService.IsVerticalView из другого класса компонентов и снова загружаю страницу домашнего компонента.вот функция из другого компонента:

SwapToVerticalView(): void
{
    if (AppService.IsVerticalView == true) {
        // change to horizonal
        AppService.IsVerticalView = false;
        // show you can return to vertical
        this.currentViewShape = "Vertical View";
    }
    else
    {
        // change to vertical
        AppService.IsVerticalView = true;
        // show you can return to horizonal
        this.currentViewShape = "Horizontal View";
    }

    // refresh the view
    if (this._charsService.AppMode == ApplicationMode.LineBreaker)
    {
        // reload again
        this.router.navigate(['home']);

    }
}

Проблема в том, что компонент не «полностью» перезагружается снова при повторном негативе на страницу, как я могу перезагрузить страницу снова вЧтобы активировать условия для templateUrl и styleUrls home component?

Я много искал, но не нашел какого-либо полезного решения, возможно, есть другой способ добиться этого и мой подходнеправильно, если есть, пожалуйста, поделитесь.