1

ここで素晴らしいツリー ディレクティブを見つけました。オリジナル: http://jsfiddle.net/n8dPm/

クリック ハンドラをアタッチしようとしています。p以下のように要素に追加しましたが、機能していません。なにが問題ですか：

コードhttp://jsfiddle.net/tHh5M/2/

module.directive("tree", function($compile) {
    return {
        restrict: "E",
        scope: {family: '='},
        template: 
            '<p ng-click="testme()">{{ family.name }}</p>'+
            '<ul>' + 
                '<li ng-repeat="child in family.children">' + 
                    '<tree family="child"></tree>' +
                '</li>' +
            '</ul>',
        compile: function(tElement, tAttr) {
            var contents = tElement.contents().remove();
            var compiledContents;
            return function(scope, iElement, iAttr) {
                if(!compiledContents) {
                    compiledContents = $compile(contents);
                }
                compiledContents(scope, function(clone, scope) {
                         iElement.append(clone); 
                });
            };
        },
        link: function (scope, elm, attrs) {
            scope.testme = function () {
                console.log('testme')
            };
        }
    };
});
4

1 に答える 1

2

コンパイル関数から返される関数がリンク関数です。link プロパティを取り除きscope.testme、コンパイル関数から返された関数に移動します。

    compile: function (tElement, tAttr) {
        var contents = tElement.contents().remove();
        var compiledContents;
        return function (scope, iElement, iAttr) {
            if (!compiledContents) {
                compiledContents = $compile(contents);
            }
            compiledContents(scope, function (clone, scope) {
                iElement.append(clone);
            });
            scope.testme = function () {
                console.log('testme')
            };
        };
    }

http://jsfiddle.net/tHh5M/3/

于 2013-10-01T20:13:59.817 に答える