简体   繁体   中英

How to show hidden element with AngularJS

Hello I have a hidden div and I want to show it when I press a button in angularjs

When I click the button the div shows for a second and dissapears back.

Here is what I`ve tried.

<button ng-click="myValue = true">Click</button>
<!--SELECTEAZA DECLARATII -->        
<div ng-show="myValue" class="ng-hide">
    <b:selectOneMenu ajax="true" process="@this" label="Selecteaza declaratie"  >         
        <f:selectItems value="#{cereri.declaratii}" var="beer2" 
               itemValue="#{beer2}" itemLabel="#{beer2}" />
    </b:selectOneMenu>
</div>

This is the js class:

$scope.myValue = false;

How can I make the div show when I press the button

Thanks

It works in the DEMO below.

The ng-show directive successfully removes the ng-hide class and the element becomes visible. There must be something else in your code that is causing the problem.

People will be better able to provide help if you provide code that they can use to reproduce the problem .

The DEMO

 <script src="//unpkg.com/angular/angular.js"></script> <body ng-app> <button ng-click="myValue = true">Click</button> <!--SELECTEAZA DECLARATII --> <div ng-show="myValue" class="ng-hide"> HIDDEN ELEMENT myValue = {{myValue}} <b:selectOneMenu ajax="true" process="@this" label="Selecteaza declaratie" > <f:selectItems value="#{cereri.declaratii}" var="beer2" itemValue="#{beer2}" itemLabel="#{beer2}" /> </b:selectOneMenu> </div> </body>

如果您的 html 中有该类: class="ng-hide" ,请将其删除(angularjs 添加该类以在ng-show表达式计算为false时隐藏元素),其余的就可以了:

<div ng-show="myValue">

delete ng-hide class

you have ng-show

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM