角度和SVG滤镜

Question

将SVG与AngularJS一起使用时，遇到了一个奇怪的行为。我正在使用该$routeProvider服务配置我的路线。当我将这个简单的SVG放在模板中时，一切都很好：<div id="my-template">    <svg xmlns="http://www.w3.org/2000/svg" version="1.1">        <rect fill="red" height="200" width="300" />    </svg>    // ...</div>但是，当我添加一个过滤器时，例如以下代码：<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>然后：它可以在我的主页上运行。使用Firefox时，SVG 在其他页面上不再可见，但仍然留有空间。使用Chrome时，SVG是可见的，但根本不会模糊。当我手动（使用Firebug）删除filter样式时，SVG再次可见。这是路由配置：$routeProvider    .when('/site/other-page/', {            templateUrl : 'view/Site/OtherPage.html',            controller : 'Site.OtherPage'    })    .when('/', {            templateUrl : 'view/Site/Home.html',            controller : 'Site.Home'    })    .otherwise({        redirectTo : '/'    });Fiddle请注意，尽管Chrome可在Firefox中“运行”，但我无法在Fiddle中重现该问题。我试图用来创建我的整个SVG都无济于事document.createElementNS()。有人对发生的事情有想法吗？