如何在Angular 5组件中有条件地加载templateUrl html文件

Question

我的项目中有一个场景，请考虑，我有一个testDynamic组件

@Component({
    templateUrl: "./test-dynamic.html", // Need to override this file
    styleUrls: ['./test-dynamic.css']
})
export class testDynamic {
    constructor() { }
}

这里需要检查替代文件夹中是否存在override1.html文件，然后将该文件加载为templateUrl，否则加载组件默认的test-dynamic.html。 任何想法如何实现这一目标。

请参考下图以清楚了解

Answer 1

请参考以下链接，这是动态templateUrl的一个很好的示例

具有动态模板或templateUrl的Angular 2/4组件

Answer 2

您不能添加多个HTML文件。

您可以做的是，使用* ngIf或* ngSwitchCase仅显示模板的某些部分（如果您打算这样做）。 那么您只有一个模板html文件。

然后，模板的html将如下所示：

<div *ngIf="YOUR_CONDITION">View 01</div>
<div *ngIf="YOUR_CONDITION">View 02</div>