0

I have an HTML element annotated with ng-show which I hide/show the element based on a boolean value that's toggled between true/false on a sibling element on ng-click(). When I inspect the element in the browser, I always see the annotated with ng-show, even if it's hidden.

Here is my div with ng-show:

<div ng-show="!showWhatsNewSection" </div>
      ...

And here is my element which toggles showing / hiding the whats new section.

<span ng-click="showWhatsNewSection = !showWhatsNewSection"> </span>

Is there any way to hide the whatsNewSection from the browser source code on inspect element when that section is hidden (i.e. when showWhatsNewSection is false?

Victor Cui
  • 1,393
  • 2
  • 15
  • 35
  • If you add an ID to it, I think you could try hiding it using Chrome's built-in console. Something like `$('#SomeId').hide();` You might need to follow this if you want to use jQuery: https://stackoverflow.com/a/7474386/2720343 – Dortimer May 03 '19 at 17:54
  • 1
    ngIf instead of ngShow? You'd still see the comments where the element is missing form, but the actual element will be gone. – kendavidson May 03 '19 at 18:20
  • 1
    As @kendavidson mentioned, use `ng-if` instead of `ng-show`. That will remove element from DOM. – Ashish May 03 '19 at 18:51
  • Thanks! `ng-if` is what I was looking for – Victor Cui May 03 '19 at 20:31

0 Answers0