Question

全部：

[更新]：根据这篇文章：Angular.js updating SVG templates in directives

不确定这是否是正确的解决方案，但它有效：

我将角度更新为 1.3.X 并添加templateNamespace: 'svg'

=============================================== ====================

现在，我想用AngularJS测试简单的D3.js：

我的指示是这样的：

var app = angular.module("vizmods");

app.directive("axis", function(){

    return {
        restrict: "AE",
        template: "<g></g>",
        replace: true,
        scope: {
        },
        link: function(scope, EL, attrs){
            var d3el = d3.select(EL[0]);
            d3el.append("circle")
                .attr("r", 50)
                .attr("cx", 20)
                .attr("cy", 20)
                .style("fill", "red");
        }
    }; // end of dir return

});

我的html喜欢：

<svg>
    <axis></axis>
</svg>

红色圆圈不会显示。（我查看了html结构，已经生成了圆形结构。为了确保这个SVG结构有效，我复制了所有生成的结构并粘贴在页面中，然后复制的结构可以显示出来。）

我还测试：

var app = angular.module("vizmods");

app.directive("axis", function(){

    return {
        restrict: "AE",
        template: "<div></div>",
        replace: true,
        scope: {
        },
        link: function(scope, EL, attrs){
            var d3el = d3.select(EL[0]);
            d3el.append("button").text("hello");
        }
    }; // end of dir return

});

并且

<axis></axis>

然后这会显示按钮。

有人可以帮忙吗？感谢

AngularJS指令不适用于SVG元素

0 个答案: