CODEWITHSUNDEEP
angularjsangularjs-directiveangularjs-scope
Whisher
Whisher

Reputation: 32716

angular directives ng-if replace: true

I don't really know what happens here take a look at this plunker

the example doesn't work and only works with this template

<script type="text/ng-template" id="/showErrors.html">
<div>           
    <div data-ng-if="errors">
        <p  class="alert alert-danger fade-in" data-ng-repeat="error in errors" data-ng-bind="error"></p>
    </div>
</div>          
</script>

Can anyone tell me why ?

Upvotes: 0

Views: 1034

Answers (1)

A.B
A.B

Reputation: 20445

because when you have set replace: true an actual directive div then it is div get replaced by template and its attribtes get merged

for example add class your to outer div of template

 <div class="yes" data-ng-if="errors">---------------------
                                                           |
                                                           | 
      and your directive div is  below                     > replaces and attributs are merged
                                                           |  
    <div show-errors errors="main.errors"></div> ----------

now when replace= true, resulting outer div after attributes get merged becomes

<div show-errors="" errors="main.errors" 
      class="yes ng-binding ng-scope" data-ng-if="errors">...</div>

so errors in ng-if is not available yet here in outer div when replace:true; and is available inside

trying with replace: false works fine. thats why you need extra div

Upvotes: 1

Related Questions