角度2：再次加载组件，包括templateUrl和styleUrls

Question

我有一个Component，它具有2个“视图状态”（垂直和水平）。
为了显示\加载用户首选项，我正在检查位于服务中的静态布尔属性（AppService.IsVerticalView）的值。
这是home组件：

@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的值，并再次加载home组件的页面。
这是另一个组件的功能：

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和{{1 }}家庭组件？

我进行了很多搜索，但未找到任何有用的解决方案，也许还有其他方法可以实现，而我的方法是错误的，如果有，请分享。