사용자 지정 지시문의 내부 HTML을 가져 오는 방법은 무엇입니까?

Question

나는 위에서 난 당신이 알고하지 않습니다

.directive('myModal', function() { 
    return { 
     restrict: 'A', 
     replace: true, 
     scope: { 
      myModalId: '@'    
     }, 
     compile: function(tEle, tAttrs, transcludeFn) { 
      //what to do here? 
      //I want to get div.inner of the original html 
     }, 
     template: '<div id="{{myModalId}}">' + 
      '<h1>My Heading</h1>' + 
      '<div class="b"></div>' + 
      '</div>' 
    } 
}); 

Answer 1

<div id="test"> 
    <h1>My Heading</h1> 
    <div class="b"> 
     Hello Inner 
    </div> 
</div> 

JS 같은 것으로 HTML을 생성하려면이

<div my-modal my-modal-id="test"> 
    <div class="inner">Hello Inner</div> 
</div> 

같은 HTML에 대한 지침을 만들려면 템플릿을 사용할 수 있습니다, 그것은 기존의 HTML을 덮어 쓰는 것처럼 보입니다 전에 compile가 호출됩니다. HTML을 잡아 그것을 스스로 일 (plnkr)을 보인다 교체 :

.directive('content', function($compile) { 
    var dir = { 
    restrict: 'E', 
    xemplate: '<div id="{{myModalId}}">' + 
     '<h1>My Heading</h1>' + 
     '<div class="b">Original:<br/><pre>{{original}}</pre></div>' + 
     '</div>', 
    compile: function(element, attrs, linker) { 
     var original = element.html(); // grab original 
     element.html(dir.xemplate); // set template html manually 
     return function(scope, element, attributes) { 
     scope.original = original 
     } 
    } 
    }; 
    return dir; 
});