css 中的 url 被 angular 重写

Posted 2023-03-06

【中文标题】css 中的 url 被 angular 重写

【英文标题】：url in css get rewritten with angular

【发布时间】：2015-05-20 12:50:54

【问题描述】：

在 Angular 中，使用 svgs 设置基本集和 html5mode 存在问题。它会导致像filter: url(#url) 这样的所有东西都被重写为filter: url(/base/#url)。

https://github.com/angular/angular.js/issues/8934

我已尝试禁用 html5 模式并删除基础，但每当 Angular 引导时，它仍会重写 url。

如果 svg 存在，则在加载 angular 时，它将显示正确的剪辑/过滤器，但是一旦 angular 初始化它就消失了。有谁知道解决方法？我已经尝试在定位它之前使用完整的文件路径以及使用禁用base。

我的意思是有基数 <base href='/'> 可以正常工作。

对这个问题的进一步检查表明，当初始化 angular 时，它会将过滤器转换为 svg

角度之前

<svg>
  <defs>
    <filter>
    </filter>
  </defs>
  <g> 
    <path>
  </g>
</svg>

引导后

<svg>
  <defs>
    <svg class='filter'> 
      <path>
    </svg>
  </defs>
  <g> 
   <path>
  </g>
</svg>

【问题讨论】：

你所说的“有基数”是什么意思？

【参考方案1】：

我认为您可能在索引文件的头部设置了错误的基本属性。

请务必检查所有相关链接、图像、脚本等。Angular 要求您在主 html 的头部指定 url base file() 除非 html5Mode.requireBase 设置为 传递给的 html5Mode 定义对象中的 false $locationProvider.html5Mode()。这样，相对网址将始终是 解析到这个基本 url，即使文档的初始 url 是 不同。

Documentation

【讨论】：

我在帖子中添加了更多详细信息。它与base无关，因为无论有没有它的行为都相同，chrome检查器中的url路径也是正确的。

【参考方案2】：

这最终是因为我们有一个名为 filter 的指令......

我们犯了一个严重的错误！