templateUrl geçersiz kılmadan önce AngularJS yönergesinin iç HTML'sini geri al

Question

Yakın zamanda yeniden oluşturduğum form doğrulama boilerplate için kullandığım bir yönergem var. Genişletmeden önce yönergeyi biraz daha açıklamama izin verin.

direktifi kullanımı:

<form class="form-horizontal" name="personalDetails" validated-form> 

    <!-- Pass buttons into form through here --> 
    <a href="" class="btn btn-success" 
     data-ng-click="saveDetails()" 
     data-ng-disabled="!personalDetails.$valid">Save Changes</a> 

</form> 

Daha önce, benim yönergesi böyle bir şey görünüyordu ve o çalıştı.

app.directive('validatedForm', function($compile, $sce) { 
    return { 
     restrict: 'A', 
     scope: true, 
     link: function(scope, element, attrs) { 

      var template = //... HTML boilerplate code 
      var buttons = element.html(); // Get contents of element before overriding 

      element.html(template + buttons); 
      $compile(element.contents())(scope); 

     } 
    } 
}); 

html şablonu dağınık hale geliyordu ve ben daha çok onlardan sonra daha şablonun düğmeler 'içeride' sarmak istedi. Bu yüzden daha iyi bir yönerge olduğunu düşündüğüm şeylere yeniden baktım.

app.directive('validatedForm', ['$compile', '$sce', function ($compile, $sce) { 

    var domContent = null; 

    return { 
     restrict: 'AE', 
     scope: true, 
     templateUrl: '/Content/ngViews/directives/validated-form.html', 
     link: function(scope, element, attrs) { 

      // This now returns the contents of templateUrl 
      // instead of what the directive had as inner HTML 
      domContent = element.html(); 

      // Scope 
      scope.form = { 
       caption: attrs.caption, 
       location: 'Content/ngViews/forms/' + attrs.name + '.html', 
       buttons: $sce.trustAsHtml(domContent), 
       showButtons: !(domContent.replace(' ', '') === '') 
      }; 

     } 
    }; 
}]); 

Yani ne fark ediyorum şimdi benim direktifin iç HTML içeriğinin yerine templateUrl içeriğini alır() o element.html olduğunu. Benim direktifimin içeriğini şablonUrl tarafından geçersiz kılmadan nasıl alabilirim?

Answer 1

Iniital html'ye erişmek için yönerge denetleyicisinde $transclude kullanabilirsiniz. Bu yüzden kullanarak devraldı önceki sürümlerden küçük bir değişmenin 1,2

controller:function($scope,$transclude){ 
     $transclude(function(clone,scope){ 
     /* for demo am converting to html string*/ 
     $scope.buttons=angular.element('<div>').append(clone).html(); 
     }); 

    } 

DEMO