如何在Angular 5组件中有条件地加载templateUrl html文件 [英] How to load conditionally templateUrl html file in Angular 5 component

问题描述

我的项目中有一种情况， 考虑一下，我有一个testDynamic组件

There is one scenario in my project, Consider, I have one testDynamic component

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

此处需要检查替代文件夹中是否存在override1.html文件，然后将该文件作为templateUrl加载，否则加载组件默认的test-dynamic.html. 知道如何实现这一目标吗??

here need to check if an override1.html file is exists in override folder then load this file as templateUrl otherwise load the component default test-dynamic.html. Any idea how to achieve this.?

请参考下图以清楚了解

推荐答案

您不能添加多个HTML文件.

You can't add more than one HTML file.

您可以做的是，使用* ngIf或* ngSwitchCase仅显示模板的某些部分(如果您有此意图).那么您只有一个模板html文件.

What you can do is, use *ngIf or *ngSwitchCase to show only parts of the template if that is your intention. Then you have only one template html file.

然后您模板的html将如下所示:

Then html of your template will be something like this:

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

这篇关于如何在Angular 5组件中有条件地加载templateUrl html文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！