根据全局常量替换组件中的模板 URL

Question

帮助我找到以下任务的解决方案：

假设我们有一些全局常量"env"，我想在构建时使用此常量替换组件中的模板 URL。 对于不同的常量，我们应该使用不同的模板 url。默认情况下，每个组件都有模板 URL。对于每个"env"常量，我们可以为某些组件定义模板URL，如果未为组件定义模板URL，则需要使用默认模板。

例如：

默认情况下，以下组件使用模板 URL：

AppComponent1 -> 'defaultTemplate1'
AppComponent2 -> 'defaultTemplate2'
AppComponent3 -> 'defaultTemplate3'

当我们将"env"常量设置为"env_1"时，我想使用下一个模板：

AppComponent1 -> 'env_1Template1'
AppComponent2 -> 'env_1Template2'
AppComponent3 -> 'defaultTemplate3'

对于"env"作为"env_2"需要使用：

AppComponent1 -> 'env_2Template1'
AppComponent2 -> 'defaultTemplate2'
AppComponent3 -> 'env_2Template3'

Answer 1

由于缺乏当前实现的详细信息，您可以尝试执行以下操作

环境配置 (constants.ts(

export const ENVIRONMENT: string = 'env_1';

随机组件 (child.component.ts(

import { Component, OnInit } from '@angular/core';
import * as CONFIG from '../constant';
@Component({
selector: 'app-child',
templateUrl: CONFIG.ENVIRONMENT === 'env_1' ? './child.html' : './child2.html',
styleUrls: ['./child.component.css']
})
export class ChildComponent implements OnInit {
...
}

我使用了一个基本的三元操作来决定模板 URL。您可以根据自己的意愿使其变得复杂，以决定URL。您也可以直接从环境配置文件发送 URL 路径。