templates - Angular.js - 別のディレクティブでディレクティブを使用するには?

Question

ディレクティブを別のディレクティブで使用したい。

親ディレクティブは、そのテンプレートで子ディレクティブを使用します。

これが私のコードです。

HTML

<div ng-app="myApp">
    <div ng-controller="Ctrl">
        <svg>
            <my-line></my-line>
        </svg>
    </div>
</div>

JavaScript

var myApp = angular.module('myApp',[
    'myController',
    'myDirectives'
]);

//Controller
var myControllers = angular.module('myControllers', []);
myControllers.controller('Ctrl', function($scope){
    $scope.line = [
        { nodeId:'1'},
        { nodeId:'2'},
        { nodeId:'3'}
    ]
});

//Directives
var myDirectives = angular.module('myDirectives',[]);

myDirectives.directive('myLine',function(){
    return {
        restrict: 'E',
        template:
            '<g ng-repeat="node in line">' +
                '<my-node node="{{node}}"></my-node>' + 
            '</g>'
    };
});

myDirectives.directive('myNode',function(){
    return {
        restrict:'E',
        scope:{
            node:'=node'
        },
        template:
            '<text x="0" y="0">{{node.nodeId}</text>'
    }
});

ここにjsfiddleリンクがあります。

jsfiddle

しかし、子ディレクティブは表示されません。

私は何をすべきか？

Answer 1

フィドルにいくつかのエラーがあります。私はそれらを修正しました。

最初に一番上にあるはずです

var myApp = angular.module('myApp',[
    'myControllers',
    'myDirectives'
]);

次に、myNode ディレクティブで、

'<text x="0" y="0">{{node.nodeId}}</text>'

その後、両方のディレクティブ構成に replace を追加しました。

更新されたフィドル: http://jsfiddle.net/vNF9L/

現在は何も表示されていませんが、dom を調べると、すべてが希望どおりに出力されていることがわかります。