SVG-анимация с animateTransform не работает внутри <app-root> </ app-root> Angular - PullRequest
0 голосов
/ 04 января 2019

Есть ли какая-то конкретная причина, по которой svg-анимация работает в другом месте, но не в шаблоне основного компонента?

У меня обычно есть анимированное изображение css для загрузчика, и я хотел попробовать svg анимацию.

Пример кода:

<app-root>
  <div class="loader">
    <svg version="1.1" class="svg-loader" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
    y="0px" viewBox="0 0 80 80" xml:space="preserve">

      <path id="spinner" fill="#D43B11" d="M40,72C22.4,72,8,57.6,8,40C8,22.4,
        22.4,8,40,8c17.6,0,32,14.4,32,32c0,1.1-0.9,2-2,2
        s-2-0.9-2-2c0-15.4-12.6-28-28-28S12,24.6,12,40s12.6,
        28,28,28c1.1,0,2,0.9,2,2S41.1,72,40,72z">

      <animateTransform attributeType="xml" attributeName="transform" type="rotate" from="0 40 40" to="360 40 40" dur="0.6s"
          repeatCount="indefinite" />
      </path>
    </svg>
  </div>
</app-root>

EDIT: Я тестирую его в Angular 5, и я тестирую его в Angular 7.

...