2014-10-12 53 views
1

我只是想做一個指令來包裝一個元素。我已經試過這一個:包裝指令和類複製

.directive('wrap', function() { 
    return { 
    restrict: 'A', 
    replace: true, 
    transclude: 'element', 
    template: '<div class="wrapper" ng-transclude></div>' 
    }; 
}); 

但是當我使用它:

<a class="my-class" wrap>Hello</a> 

我越來越my-class複製:

<div class="my-class wrapper" ng-transclude="" wrap=""> 
    <a class="my-class ng-scope" wrap="">Hello</a> 
</div> 

我要的就是這樣,但沒有my-class in the wrapper div:

<div class="wrapper" ng-transclude="" wrap=""> 
    <a class="my-class ng-scope" wrap="">Hello</a> 
</div> 

可能嗎?

回答

1

您CA與tranclude做到這一點:真:

app.directive('wrap', function() { 
    return { 
    restrict: 'A', 
    replace: true, 
    transclude: true, 
    template: '<div class="wrapper" ng-transclude></div>' 
    }; 
}); 

HTML:

<div wrap><a class="my-class">Hello</a></div> 

或者(如果你使用限制: 'E'):

<wrap><a class="my-class">Hello</a></wrap> 

輸出:

<div class="wrapper" ng-transclude="" wrap=""> 
    <a class="my-class ng-scope">Hello</a> 
</div> 

http://plnkr.co/edit/Bxeeo4lytcicoXE65MU9?p=preview

+0

謝謝,這實際上是我用它來工作的方式。我只是很好奇沒有明確地「包裝」它而得到類似'Hello'的結果。 – IsidroGH 2014-10-12 09:07:43