Ng-if doesn't work when contained in a String. How can I get it to work?

Question

I have declared a variable called authenticated that I want to use to show or hide a button in a popover. The user should only see the button if he has already authenticated.

I tried the ng-if with the variable in the h5 part and here it works. I think it is just the formatting inside the string for data-content because when I inspect the page it doesn't use the ng-if but it shows it in the source code.

<span ng-switch-when="null"
    class="redbox label label-primary {{types[charge.Type].CSS}}"
    style="cursor:pointer;"
    onclick="$(this).popover('toggle')"
    data-html='true'
    data-toggle="popover"
    data-trigger="manual"
    data-placement="top"
    title="{{&quot;common.BatchStatus-NotPaired&quot;|i18n}}"
    data-content="{{ getPopoverTemplate(charge) }}
        <a href='#/delete-batch?id={{charge._id}}' class='btn btn-primary btn-block' ng-if='authenticated'><span>{{&quot;common.Delete-Batch&quot;|i18n}}</span></a>">
  <h5 ng-if='authenticated'><strong>{{charge.LogicalId}} ({{charge.RfidNullCounter}})</strong></h5>
</span>

Just to make it clear. It works on the `
` element but does not work in the `` element? And just a side note which might affect the situation is that you're not correctly closing the `` tag. You have the `` element inside the `` tag and you close the span after it. This is not proper HTML structure. — thepio, Sep 30 '16 at 05:50
@thepio Yes it works on the '
' element but not in the '' element. How could the '' element be insiede the '' tag if I close it before? I don't know if I understand you correct here. — IAmRoot, Sep 30 '16 at 06:03
@thepio see my edit of the comment. I don' know exactly what you mean or what/how to correct it. — IAmRoot, Sep 30 '16 at 06:07
Yeah sorry for confusing the stucture. I removed my answer. But are you using a plugin for the popover or what happens on the click event? Can you share some code. — thepio, Sep 30 '16 at 06:35
As I said already I am new to the topic and I am just working on a project that already exists. I think the popover is just the "standard" html/angular popover. When you click the button it will load another page with a parameter, like you see here: `...href='#/delete-batch?id={{charge._id}}'...` There I can delete a batch. Thats why there is the authentication and why the button should only show if you have the rights to delete something. — IAmRoot, Sep 30 '16 at 06:41
I think, that `ng-if` in h2 are compiling by angularjs, but text inside `data-content` - not. You are mixing the angular way and jquery way. — Alexander Anikeev, Sep 30 '16 at 08:07
@AlexanderAnikeev ok. But how can I make it work? Do you know a way to show the button/link in the popover and show/hide it with ng-if? I also tried it with a template in the controller, see here: `data-content="{{ getPopoverTemplate(charge) }}` — IAmRoot, Sep 30 '16 at 08:21

Ng-if doesn't work when contained in a String. How can I get it to work?

` element but does not work in the `` element? And just a side note which might affect the situation is that you're not correctly closing the `` tag. You have the `` element inside the `` tag and you close the span after it. This is not proper HTML structure.

' element but not in the '' element. How could the '' element be insiede the '' tag if I close it before? I don't know if I understand you correct here.

0 Answers0