Aşağıdaki çözümlerden biri gelip orada popüler özyinelemeli açısal yönergesi Q&A Bir çift vardır:

• el ile kademeli '' zamanı kapsam durumuna göre HTML derleme
  • example 1 [stackoverflow]
  • example 2 [angular jsfiddles page]
• kendini ifade eden, ama bir <script> şablon bir Direktif kullanmayın
  • example 1 [google groups]

İlkitabii önceden derlenmiş kod kaldıramadığınız sorun var anlaşılır manuel derleme süreci yönetmek.İkinci bir yaklaşımvar sorunun... olmadığım bir yönerge ve eksik konusundaki güçlü yetenekleri, ancak daha acil, olamaz parametrik aynı şekilde bir Direktif olabilir; bu sadece bağlama için yeni bir denetleyici örneği.

El ile angular.bootstrap @compile() bağlantıyı bir işlev yapıyor ile oynuyorum, ama bu el ile öğeleri izini kaldırmak ve eklemek için tutma sorunu ile beni bırakır.

İyi bir şekilde ekleme/çıkarma unsurlarını yöneten parametreli özyinelemeli bir desen çalışma zamanı durumunu yansıtır. Yani, bir düğümün alt geçtiğini kimin add/delete düğüm bir düğme ve bazı giriş alanı ile bir ağaç düğümleri. Zincirleme kapsamları ile ikinci yaklaşım (ama ne yapacağım hakkında hiç bir fikrim yok) bir arada olabilir mi?

Çözümleri iş parçacığı @dnc253, özyineleme ben soyutlanmış işlevselliği into a service ile belirtilen açıklanan esinlenerek.

module.factory('RecursionHelper', ['$compile', function($compile){
    return {
        /**
         * Manually compiles the element, fixing the recursion loop.
         * @param element
         * @param [link] A post-link function, or an object with function(s) registered via pre and post properties.
         * @returns An object containing the linking functions.
         */
        compile: function(element, link){
            // Normalize the link parameter
            if(angular.isFunction(link)){
                link = { post: link };
            }

            // Break the recursion loop by removing the contents
            var contents = element.contents().remove();
            var compiledContents;
            return {
                pre: (link && link.pre) ? link.pre : null,
                /**
                 * Compiles and re-adds the contents
                 */
                post: function(scope, element){
                    // Compile the contents
                    if(!compiledContents){
                        compiledContents = $compile(contents);
                    }
                    // Re-add the compiled contents to the element
                    compiledContents(scope, function(clone){
                        element.append(clone);
                    });

                    // Call the post-linking function, if any
                    if(link && link.post){
                        link.post.apply(null, arguments);
                    }
                }
            };
        }
    };
}]);

Aşağıdaki gibi kullanılır

module.directive("tree", function(RecursionHelper) {
    return {
        restrict: "E",
        scope: {family: '='},
        template: 
            '<p>{{ family.name }}</p>' 
            '<ul>'   
                '<li ng-repeat="child in family.children">'   
                    '<tree family="child"></tree>'  
                '</li>'  
            '</ul>',
        compile: function(element) {
            // Use the compile function from the RecursionHelper,
            // And return the linking function(s) which it returns
            return RecursionHelper.compile(element);
        }
    };
});

Bu bir demo için Plunker bkz. Bu en iyi çözüm çünkü ben gibi:

1. Html daha temiz kılan özel bir yönerge ihtiyacın yok.
2. Özyineleme mantığı size direktifler temiz tutmak çok RecursionHelper hizmete uzak soyutlanmış.