css 中的 url 被重写为 angular

Question

在 angular 中，使用 svgs 的基本设置和 html5 模式存在问题。它导致 filter: url(#url) 之类的所有内容都被重写为 filter: url(/base/#url)。

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

我试过禁用 html5 模式并删除基础，但每当 angular bootstrap 时，它仍然会重写 url。

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

我的意思是有基础集 <base href='/'> 正常工作。

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

之前 angular

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

在bootstrap

之后

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

Answer 1

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

Be sure to check all relative links, images, scripts etc. Angular requires you to specify the url base in the head of your main html file () unless html5Mode.requireBase is set to false in the html5Mode definition object passed to $locationProvider.html5Mode(). With that, relative urls will always be resolved to this base url, even if the initial url of the document was different.

Documentation

Answer 2

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

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

css 中的 url 被重写为 angular

url in css get rewritten with angular

javascript

css

svg

base-url

angularjs

之前 angular

在bootstrap