Question

我的Angular 6应用程序中有一个表，该表显示服务中的内容。在表中，我有两列使用完全相同的属性。 {{standing.teamName}}

第一列将团队名称显示为文本，并且可以正常工作。例如：西班牙文

    <ng-container matColumnDef="Equipo">
      <th mat-header-cell *matHeaderCellDef>Equipo</th>
      <td mat-cell *matCellDef="let standing">{{standing.teamName}}</td>
    </ng-container>

第二列使用完全相同的值来参数化img源。

<ng-container matColumnDef="img">
      <th mat-header-cell *matHeaderCellDef></th>
      <td mat-cell *matCellDef="let standing"><div><img mat-card-avatar src="../../assets/Flags/{{standing.teamName}}.png" alt=""></div></td>
    </ng-container>

在这种情况下，我遇到的问题是： GET http://localhost:4200/assets/Flags/Espa%C3%B1a.png 404（未找到）

我尝试完全按照Espa％C3％B1a.png命名该文件，以查看是否可以找到但找不到。

我在重音符号和其他西班牙语字符上遇到了同样的问题，我不知道为什么它可以在一个中起作用，而在另一个中不起作用。

Answer 1

验证您的HTML标题中是否包含以下元属性：

<meta charset="UTF-8">

还要验证数据库/表的字符集是否也设置为UTF-8。

这足以使其正常工作。

但是，我个人建议您在URI中仅使用安全字符，将'ñ'替换为'n' ，并将人声替换为带有没有口音的人声。我也尝试避免使用大写字母。

这样可以避免此类问题，帮助您进行SEO，并使代码更易于移植，从而最大程度地提高服务器和浏览器之间的兼容性。

在以下外部链接中，您可以阅读西班牙社区有关此问题的一些建议：

http://www.forosdelweb.com/f64/url-amigables-realmente-no-deben-usar-acentos-ni-e-872760/

在图片网址中使用西班牙语字符时出现问题

1 个答案: