Questions tagged [ng-show]

The ngShow directive shows or hides the given HTML element based on the expression provided to the ngShow attribute. The element is shown or hidden by removing or adding the .ng-hide CSS class onto the element. The .ng-hide CSS class is predefined in AngularJS and sets the display style to none (using an !important flag).

The ngShow directive shows or hides the given HTML element based on the expression provided to the ngShow attribute. The element is shown or hidden by removing or adding the .ng-hide CSS class onto the element. The .ng-hide CSS class is predefined in AngularJS and sets the display style to none (using an !important flag). For CSP mode please add angular-csp.css to your html file (see ngCsp).

See the AngularJS documentation for more information.

522 questions
193
votes
7 answers

AngularJS: ng-show / ng-hide not working with `{{ }}` interpolation

I am trying to show / hide some HTML using the ng-show and ng-hide functions provided by AngularJS. According to the documentation, the respective usage for these functions are as follows: ngHide – {expression} - If the expression truthy then the…
My Head Hurts
  • 36,367
  • 15
  • 69
  • 110
113
votes
6 answers

How do I toggle an ng-show in AngularJS based on a boolean?

I have a form for replying to messages that I want to show only when isReplyFormOpen is true, and everytime I click the reply button I want to toggle whether the form is shown or not. How can I do this?
liamzebedee
  • 12,096
  • 19
  • 65
  • 114
47
votes
1 answer

ng-show="true" but still has class="ng-hide"

I'm new to AngularJS, so there may be a simple resolution to my problem. I've been working on this form. I have two inputs - one is for the number of doors and one is for the number of windows. I then have several divs that I want to show if they…
Josh
  • 625
  • 1
  • 5
  • 11
45
votes
7 answers

Why is this simple AngularJS ng-show not working?

I cannot figure out why my simple AngularJS app not working as intended. "Loading..." is supposed to be hidden, and "Done!" should be shown after 1 second. html:
darktideac
  • 453
  • 1
  • 4
  • 4
27
votes
9 answers

AngularJS Group By Directive without External Dependencies

I'm new to Angular and would like to learn the best way to handle a problem. My goal is to have a reusable means to create group by headers. I created a solution which works, but I think this should be a directive instead of a scope function within…
Darryl
  • 1,421
  • 1
  • 11
  • 19
23
votes
3 answers

ng-show disturbing div layout - angularJS

I am using ng-show="!notesOpened" to hide a div if the notesOpened variable is true. However when hidden it messes up layout. Is there a way to make ng-show act in the same way as the css property visibility:hidden? so that all div elements around…
FootsieNG
  • 709
  • 2
  • 10
  • 26
23
votes
1 answer

ng-Animate not working for a Hide and Show setting

I'm using AngularJS version 1.2.11. I've set a toolbar to slide in and out with a transition using ng-Animate (show and hide). Here is the HTML:
Sandeep
  • 233
  • 1
  • 2
  • 5
18
votes
3 answers

AngularJs Inline Check if an array check

Inline in AngularJs is there a way to check if something is an array? I would have thought this to work:
Hi
I have verified it is in fact an array. Is there something I am missing or another way?
Adam
  • 3,301
  • 6
  • 28
  • 50
18
votes
3 answers

How do I use angular ng-hide based on the page/route that I am currently on?

have an angular application that I want to hide one of the 'included views' if the main view is the homepage view.
17
votes
7 answers

Why this ng-show ng-hide not working

I have simple app in AngularJS. I want to show messages dynamically when an AJAX request is made. Unfortunately it always in hidden state and I can't figure out why. HTML:

show

Namal
  • 1,931
  • 3
  • 15
  • 25
16
votes
6 answers

How to prevent element show before AngularJS initialized( ng-show )

In AngularJS, I wonder how to prevent the elements shown on page before ng-show take effect, I found some posts talk about ng-cloak, but it seems not work in my case, probably the ng-cloak is for prevent double curly bracket rather than Element…
Kuan
  • 10,085
  • 18
  • 76
  • 168
14
votes
7 answers

Show Hide a div in angular 7

I am trying to show/hide a div in angular 7 using ng-model and ng-hide but its not working. button to Show/Hide- used ng-model to set expression div to Show/Hide, Used ng-hide to hide…
Ayush Jain AJ
  • 156
  • 1
  • 1
  • 5
12
votes
4 answers

AngularJS: ng-show vs display:none

I had a use case whereby I have to keep an HTML element hidden by default using CSS as follows: HTML:
CSS: .item { display: none; } But, I need to toggle the element's visibility using ng-show after the page has…
Tarun Dugar
  • 8,451
  • 6
  • 38
  • 68
11
votes
1 answer

angular animations not working for ng-show when changing class using ng-class

I want to create a slider for some objects that are contained in an unordered list, using ng-show and animations. I have this working well when the objects are sliding in one direction. However, when I want the user to be able to slide objects left…
Tom O'Brien
  • 1,637
  • 4
  • 30
  • 66
11
votes
1 answer

Angular ng-show if string not empty does not work

I am writing a web app using AngularJS. The user submits up to 3 keywords to the server. I would like to show commas in between the keywords only if there are enough keywords. For example: if there are no keywords, then: if there is 1 keyword,…
1
2 3
34 35