javascript - Angularjs and bootstrap pagination not hiding divs correctly -
i using angularjs , pagination show multiple divs. hiding divs based on criteria. see code exract below
<div class="dataitem" dir-paginate="x in parameterstodisplay | orderby:'name' | filter:textfilter | itemsperpage: pagesize" current-page="currentpage" ng-hide="x.detaillevel > detaillevel"> <label id="lblparametername{{x.configid}}" class="dataitemlabel">{{x.name}}</label> <label id="lbldescription{{x.configid}}" class="dataitemlabel">{{x.description}}</label> <label id="lblunits{{x.configid}}" class="dataitemunits">{{x.units}}</label> <input id="txtparametervalue{{x.configid}}" class="dataitemvalue" type="text" ng-blur="checkcongigvalue($event, x)" value="{{x.value}}" /> </div> </div> the problem divs should hidden not visible still take space. if remove pagination , use div ng-repeat works fine , hidden divs totally disappear.
i read bootstrap css hidden uses display:hidden , overwrites angularjs css uses display:none. believe can overridden correct problem, have tried several things , can't seem work out.
could give me simple example showing how this.
thank in advance!
you have use ng-if instead of ng-show/hide.
the ngif directive removes or recreates portion of dom tree based on expression. if expression assigned ngif evaluates false value element removed dom, otherwise clone of element reinserted dom.
Comments
Post a Comment