0

I am trying to make a function call only when the element is visible. I am using Bootstrap to control the visibility.

<td class="hidden-xs col-sm-4 col-md-4 col-lg-4" 
    ng-if="dataObject.property==false" 
    ng-class="{'custom_class':$last}" 
    ng-init="test()">

test() is getting called whether the element is visible or not. How can I fix this?

Jim Buck
  • 2,249
  • 23
  • 34
Anonymous
  • 3,923
  • 10
  • 29
  • 37

1 Answers1

1

Based on your code above and your ng-if condition, I'd re-write test() as:

function test() {
   //Exit if not visible
   if (dataObject.property) return;

   //Do stuff if visible
}
Shadow3188
  • 255
  • 2
  • 7
  • The problem is that I need to call test() whether dataObject.property is true or false. I have a span below the td that has different values based on dataObject.property. The main thing here is that I need to call test() only when the screen size is col-sm-4, col-md-4 or col-lg-4 – Anonymous Mar 12 '15 at 20:18
  • It sounds like you are not separating your UI from your logic. You could [check to see if the element is visible](http://stackoverflow.com/a/178450/1654818), but it's probably a better to handle all of that in the controller, instead of in the template. – Jim Buck Mar 12 '15 at 20:50