<svg><use> в крае не появляется [угловой 2]

У меня есть этот код, который отлично работает в хроме:<svg><use> в крае не появляется [угловой 2]

<html> 
    <head> 
    ...some tags 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    </head> 
    <body> 
    <svg xmlns="http://www.w3.org/2000/svg" style="display: none;"> 
     <g id="overview"> 
     <path data-name="overview" d="M12.5,0A12.5,12.5,0,1,0,25,12.5h0A12.5,12.5,0,0,0,12.5,0Zm0,19C7.22,19,3,12.5,3,12.5S7.22,6,12.5,6,22,12.5,22,12.5,17.78,19,12.5,19Zm0-9.49a3,3,0,1,0,3,3,3,3,0,0,0-3-3Z"/> 
     </g> 
    </svg> 
    <app> 
     ..some tags 
     <svg viewBox="0 0 25 25" width="25" height="25"> 
     <use xlink:href="#overview" /> 
     </svg> 
     ..some tags 
    </app> 
    </body> 
</html>

Но в краю, я ничего не вижу. Также попытался добавить к нему цвет (с fill). опять же, работает в хроме, а не в крае

Примечание
Это угловое 2 приложение, так что svg с use тега внутри углового элемента и визуализации с угловым компилятором

источник

2017-02-19 Jo Jo B.

Исключая 'XLink:' не будет работать в любом браузере, кроме Chrome. Добавьте к вашему вопросу полный [MCVE] (http://www.stackoverflow.com/help/mcve). То, что вы разместили здесь, недостаточно для диагностики вашей проблемы. –

Я могу добавить весь код, но он очень длинный. пытаясь сохранить его как можно проще. Ред. Что еще вам нужно иметь? –

Какой у вас правильный код 'svg'? – Rahul

Тот факт, что вы использование AngularJS - большой ключ.

Проверьте свою страницу. Если вы используете угловую маршрутизацию, то ваш заголовок может иметь тег <base>. Если это так, то ваши ссылки <use> также должны будут включать URL-адрес страницы, иначе они будут затронуты <base>, как и другие ссылки.

Другими словами, вы должны сделать что-то вроде:

<use xlink:href="this-file.html#overview" />

или, возможно,

<use xlink:href="/path/to/this/file.html#overview" />

источник

2017-02-20 01:20:31

Спасибо за подсказку! Я извлек svg во внешний файл, поэтому он не будет затронут маршрутизатором –

<svg><use> в крае не появляется [угловой 2]

ответ

Смежные вопросы