Podczas korzystania z SVG z AngularJS natknąłem się na dziwne zachowanie. Używam$routeProvider usługa konfiguracji moich tras. Kiedy umieściłem ten prosty SVG w moich szablonach, wszystko jest w porządku:

<div id="my-template">
    <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
        <rect fill="red" height="200" width="300" />
    </svg>
    // ...
</div>

Ale kiedy dodam filtr, na przykład z tym kodem:

<div id="my-template">
    <svg xmlns="http://www.w3.org/2000/svg" version="1.1">
        <defs>
            <filter id="blurred">
                <feGaussianBlur stdDeviation="5"/>
            </filter>
        </defs>
        <rect style="filter:url(#blurred)" fill="red" height="200" width="300" />
    </svg>
</div>

Następnie:

To działa na mojąstrona główna.ZFirefox, SVG nie jest już widocznypozostałe strony, ale nadal pozostawia miejsce, gdzie by było. ZChrom, SVG jest widoczny, ale nie jest zamazany.SVG jest widoczny ponownie po ręcznym usunięciu (za pomocą Firebug)filter styl.

Oto konfiguracja tras:

$routeProvider
    .when('/site/other-page/', {
            templateUrl : 'view/Site/OtherPage.html',
            controller : 'Site.OtherPage'
    })
    .when('/', {
            templateUrl : 'view/Site/Home.html',
            controller : 'Site.Home'
    })
    .otherwise({
        redirectTo : '/'
    })
;

Skrzypce

Zauważ, że nie udało mi się odtworzyć problemu z Chrome w skrzydle, chociaż „działa” w Firefoksie.

Próbowałem bezskutecznie tworzyć całego SVGdocument.createElementNS().

Czy ktoś ma pojęcie o tym, co się dzieje?