角CLI：前綴，以圖像的路徑到CSS

Question

在組件的CSS鏈接圖像看起來是這樣的：

background: url("/assets/map.jpg"); 

，但我需要在生產CSS路徑，圖像將可以解決這樣的：

background: url("/static/assets/map.jpg"); 

Angular CLI可以做到這一點嗎？

Answer 1

您可以使用isDevMode與ngClass。假設你的css如下所示

.bg-dev { 
    background: url("/assets/map.jpg"); 
} 

.bg-prod { 
    background: url("/static/assets/map.jpg"); 
} 

使用ngClass在這兩個類之間切換。

<some-element [ngClass]="{'bg-dev': devMode , 'bg-prod': !devMode}">...</some-element> 

，並在組件的答案

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

export class AppComponent { 
    devMode:boolean = false; 

    constructor() { 
    this.devMode = isDevMode(); 
    } 
}