angular-cli:根据环境使用不同的模板 [英] angular-cli: Use different templates depending on the environment

问题描述

我正在使用 @ angular/cli:1.0.0 ，并且我想根据环境使用组件模板.我已经实现了这一点:

I'm using @angular/cli: 1.0.0 and I want to use component templates depending on the environment. I've already implemented this:

import {Component} from '@angular/core';
import {environment} from '../environments/environment';

@Component({
  selector: 'tbe',
  templateUrl: environment.BASE_TEMPLATE_PATH+'app.component.html'
})
export class AppComponent {
  ...
}

我的环境设置如下:

export const environment = {
  production: false,
  BASE_TEMPLATE_PATH: '../templates/default/'
};

构建过程实际上可以正常工作，但是浏览器控制台会引发错误:

The building process actually works but the browser console throws an error:

Error: Cannot find module "."

如果我将 environment.BASE_TEMPLATE_PATH +'app.component.html'替换为实际路径，则它会起作用.

If I replace environment.BASE_TEMPLATE_PATH+'app.component.html' with the actual path, it works.

是否可以在此处使用环境变量?如果是，我的错误在哪里?

Is it possible to use environment variables here? If yes, where is my mistake?

更新:

我为我的问题找到了更好的解决方案: http://www.smartjava.org/content/dynamic-component-loading-angular2-replace-compile

I found a better solution for my problem: http://www.smartjava.org/content/dynamic-component-loading-angular2-replace-compile

我更改了插件示例，将其设置为templateUrl而不是纯HTML模板，并且可以使用: https://plnkr.co/edit/tfxl3ba869oFtrqzyLNk

I've changed the plunker example to set a templateUrl instead of the plain html template and this works: https://plnkr.co/edit/tfxl3ba869oFtrqzyLNk

问题:

The Problem:

ComponentResolver已过时，我不能在当前的Angular4版本中使用它.我用 ComponentFactoryResolver 进行了尝试，但这不起作用.

ComponentResolver is depreciated and I can't use it with the current Angular4 version. I tried it with ComponentFactoryResolver but it doesn't work.

推荐答案

(至少在最新的Angular版本中)可行的方法是

What also would work (at least in the latest Version of Angular) would be

import {Component} from '@angular/core';
import {environment} from '../environments/environment';

const env = environment;

@Component({
  selector: 'tbe',
  templateUrl: env.BASE_TEMPLATE_PATH+'app.component.html'
})

export class AppComponent {
  ...
}

我正面临着同样的任务，所以我在摆弄.我还可以确认，其他文件未包含在您的AOT版本中.

I am facing the same task so I fiddles around. I also can confirm, that the other files are not included in your AOT-build.

这篇关于angular-cli:根据环境使用不同的模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！