Question

我刚刚在Webform项目中复制了我的角度构建脚本，并将该项目部署在IIS中。

注意：我只复制了不在IIS内部单独部署的脚本文件。

我已经在webform项目的Scripts文件夹中复制了angular dist文件夹。

在Angular中，我已将 base href 设置为“ index.html 中的” ../../ Scripts / dist“ > 文件。

一切都可以正常工作，例如路由，加载图像，js文件等。只有svg图标没有加载，并出现 404 Not Found 错误。

对于Angular页面，除了svg之外，所有内容（css，jpg，js）均从 http://localhost/Angular2/Scripts/dist/main.js 等。

但是svg图标正在尝试从路径获取负载
http://localhost/Angular2/assets/features/home.svg 代替 http://localhost/Angular2/Scripts/dist/assets/features/home.svg

我不确定为什么对于svg图标，基本href无法正常工作。

下面是我在材质库中使用svg图标的代码。

constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) {
    iconRegistry.addSvgIcon('home', sanitizer.bypassSecurityTrustResourceUrl('/assets/features/home.svg'));
    iconRegistry.addSvgIcon('library', sanitizer.bypassSecurityTrustResourceUrl('/assets/features/library.svg'));
    iconRegistry.addSvgIcon('guest', sanitizer.bypassSecurityTrustResourceUrl('/assets/features/guest.svg'));

如果我用下面的一行修改了上面的行，那么它工作正常。

constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) {
    iconRegistry.addSvgIcon('home', sanitizer.bypassSecurityTrustResourceUrl('Scripts/dist/assets/features/home.svg'));
    iconRegistry.addSvgIcon('library', sanitizer.bypassSecurityTrustResourceUrl('Scripts/dist/assets/features/library.svg'));
    iconRegistry.addSvgIcon('guest', sanitizer.bypassSecurityTrustResourceUrl('Scripts/dist/assets/features/guest.svg'));

我可以知道为什么基本href不申请SVG图标吗？

谢谢。

Answer 1

尝试使用相对路径：

改变

'/assets/features/home.svg'

到

'./assets/features/home.svg'

您的代码：

constructor(iconRegistry: MatIconRegistry, sanitizer: DomSanitizer) {
    iconRegistry.addSvgIcon('home', sanitizer.bypassSecurityTrustResourceUrl('./assets/features/home.svg'));
    iconRegistry.addSvgIcon('library', sanitizer.bypassSecurityTrustResourceUrl('./assets/features/library.svg'));
    iconRegistry.addSvgIcon('guest', sanitizer.bypassSecurityTrustResourceUrl('./assets/features/guest.svg'));

资产未考虑基本href网址-找不到错误

1 个答案: