Angular 7 点图像到 cdn

Question

如何更改所有 <Img src='./assets/abc.svg'>至 <Img src='cdn.example.com/abc.svg'> ？基本上我想转换图像源。

我知道 --deployUrl和 baseHref选项，但这些东西似乎不会改变 imgs 的 src属性。另请参阅:https://github.com/angular/angular-cli/issues/6666

Answer 1

我不知道如何使用命令行参数来完成它，我不知道它是否已经存在。但您可以使用管道以编程方式完成此操作。

import { environment } from './environments/environment';

@Pipe({
    name: 'env',
})
export class EnvPipe implements PipeTransform {

    transform(url: any): object {
        return environment.production ? /*do transformation here*/ : url;
    }
}

在你的模板中

<Img src={{'./assets/abc.svg' | env}}>

缺点是在你所有的 url 中添加这个管道(有被遗忘的风险)