Angular 4中的环境变量

Question

.element {
  background: url(env.asset-path)
}

我想要的是在 Angular 端检测环境并在 CSS 中定义资产路径

我知道我可以用 js 检查服务器名称/域，但我不知道如何将变量传递给 css/scss 文件

我正在使用 Angular4/Typescript/scss

Answer 1

你可以通过导入来获取你的环境变量，就像你的 main.ts 文件一样：

import { enableProdMode } from '@angular/core';

myurl = environment.production

您不能将这些变量添加到您的 css 文件中，但您可以操作 dom，并通过绑定到 src 属性或执行 angular 属性绑定来添加背景 url。 1)

<img [src]="myurl">

2)

<div class="background"
     [ngStyle]="{ 'background-image': 'url(myurl)'}">