angularjs ng-if hide different div

Question

So I have an ng-if that looks like this

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p style="margin-left: 2px;font-style: italics;font-family: 'Roboto', sans-serif; font-size: 12px;color: #818A8F;" ng-bind="'(' + progress + '%' + ' ' + 'complete)'"></p>

<div ng-if="progress == 100">
  <i class="material-icons x{{$index}}" style="position: relative; bottom: 100px; left: 600px; cursor: pointer;" ng-click="vm.removeFile($index)">close</i>
  <br>
  <div class="input-field col m2 l2">
    <input placeholder="First eye exam" id="desc{{$index}}" type="text" class="validate square-box" style="width: 400px !important;">
    <label for="desc{{$index}}" class="active">Description</label>
  </div>
</div>

When the ng-if is triggered, I want to hide the p thats right above the ng-if (and other stuff in the html as well)

I tried something like

<div ng-if="progress=100"><script>$('p').hide();</script></div>

but obviously that didnt work. whats the correct way of doing this?

Dario · Accepted Answer · 2017-01-27 17:02:12Z

2

Just add

ng-hide="progress == 100"

to all the elements you want to hide. Angular will take care of hiding them when the condition is satisfied.

answered Jan 27, 2017 at 17:02

Dario

6,3109 gold badges42 silver badges53 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

IWI Over a year ago

worked great. very simple. thanks. ill accept this as the answer in a few min

Collectives™ on Stack Overflow

angularjs ng-if hide different div

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related