angularjs - preventing angular to run in non displayed DOM elements -

lets have html structure this

<myhandler>     <element_1 ng-controller="..." ng-init="">         content     </element_1>     <element_2 ng-controller="..." ng-init="">         content     </element_2> </myhandler> 

so, css saying element_2 has display: none;

how tell angular not run on these lements, hidden? , run (once) when visible?

to clarify case more, myhandler handling authorization , displaying element_1/element_2 depending on permissions.

so don't want initialized element_2 if has no permissions

instead of keeping display none ,just keep attribute ng-if flag variable because if use ng-if no element added dom or if no element added no controller instantiated.

<myhandler>     <element_1 ng-controller="..." ng-init="">         content     </element_1>     <sample ng-if="isdisplay">     <element_2  ng-controller="..." ng-init="">         content     </element_2> </sample> </myhandler>