Questions tagged [angular-ng-if]

'ngIf' is an Angular core directive that toggles the presence of the targeted element in the DOM. Do not use this tag for the 'ng-if' directive in the older AngularJS version.

ngIf is an Angular directive that alters the targeted element.

From the documentation:

Conditionally includes a template based on the value of an expression.

1223 questions
3
votes
1 answer

How to pass ng if scope to parent scope

ngIf creates another scope inside parent scope. According to angular documentation, as I understand from this link, is passes inside scope to parent scope in theory. But in practice, it does not. I need to pass this scope features to parent scope.…
xxlali
  • 996
  • 2
  • 15
  • 43
3
votes
3 answers

dynamic variable inside ngif not working

I have a piece of code like this ng-show="!edit{{id}} && imageUrl" But this does not seem to work. Where as ng-show="!edit1 && imageUrl" works. Is there any problem in syntax?? Actual Piece of code template: '
Hacker
  • 7,798
  • 19
  • 84
  • 154
3
votes
2 answers

When to use ng-if vs ng-show/ng-hide?

I understand that ng-show and ng-hide affect the class set on an element and that ng-if controls whether an element is rendered as part of the DOM Are there any examples on choosing ng-if over ng-show/ng-hide or vice-versa?
Anil kumar
  • 930
  • 7
  • 18
3
votes
3 answers

ng-show and ng-if lags to hide content

I have the following in to show and hide the clear button based upon if the searchQuery is empty or not. When a user starts typing in the input box, the button shows instantly. However, when the user either clicks the clear button or deletes all…
robert
  • 819
  • 1
  • 10
  • 24
3
votes
1 answer

AngularJS: Is there a convenient way to show and bind on an element if value is defined?

I am looking for one line syntax for this: {{value}} Maybe something like:
Trantor Liu
  • 8,770
  • 8
  • 44
  • 64
3
votes
1 answer

Show only open div with angular if

I'm trying to acheive the same behavior as the spring code below:
3
votes
1 answer

Ng-if causing memory leak in angular js

Ng-if causing memory leak in angular js! Picture :https://www.mediafire.com/?ojoc55ccnyqlxyb My app have two page first page is homepage to show a input to search second page is empy page to release memory . How did I detected leak? Run my app…
3
votes
1 answer

AngularJS multiple ng-if are not being updated simultaneously. Why? How to fix?

I have two buttons to link and unlink a social sign-in provider.
3
votes
4 answers

Angular directives with ng-if seem to loose model

I am fairly new to Angular and trying to make a directive that will construct a form input, usually a text-input, but sometimes a select box based on whether or not the input is associated with an array of options. Simplifying down, my code looks…
2
votes
1 answer

AngularJS ng-if is not working while the condition is true

I'm using angular.min.js 1.8.2 for Coursera AngularJS Single Page Application. I created an itemAdder to add a shopping list by users, the items will show in showList. Once you bought the items, you can click bought button to put to buy list to…
KTse
  • 21
  • 3
2
votes
1 answer

ngIf still renders div on false condition

I am trying to show a series of material cards based on a flag in my data. If the flag is falsy, I'm still getting an empty div (and thus extra space) injected into the DOM. Assume I have an array of Fruit objects that have an isBanana flag. My…
PaulBunion
  • 346
  • 2
  • 18
2
votes
1 answer

*ngFor on different divs in Angular

I have markup in an angular project that looks like this.
img1

{{ popular.title }}

{{ popular.caption…

Itra
  • 137
  • 1
  • 1
  • 9
2
votes
1 answer

Struggle in *ngIf in angular

I am trying to add site1Sec.length < 1 into *ngIf .component.ts site1Sec = []; site2Sec = []; .html
hanushi
  • 1,169
  • 2
  • 12
  • 27
2
votes
3 answers

Custom component receives boolean variable but does not update NgIf in HTML

I have a custom component that has an *ngIf in its view and receives a boolean variable, but *ngIf doesn't work. This is the code: Component @Input('title') titleText; @Input('backButton') backButton; @Input('avatarImage')…
2
votes
2 answers

Nested Condition in *ngIf using ng-container

I am working on requirements where I need to show the list of rows based on some conditions. There is a table cell(td) whose value should be populated based on some condition. I want the following to achieve in angular using…
Virender Thakur
  • 327
  • 3
  • 12