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
5
votes
3 answers

Multiple Conditions in ngIf in Angular 6

I want to hide one div and want to show another for that I have written below code My Code My problem is I have used multiple conditions in ngIf but not working properly. Once I click on "Show sub content1" want to hide main content and want to show…
vedankita kumbhar
  • 1,468
  • 6
  • 19
  • 42
5
votes
6 answers

Angular *ngIf check if key exists in map

I have a map that looks like: let mapToSearch = { 'aaa': '123', 'bbb': '456' } and I have a variable: let keyToFind = 'aaa'; In my HTML template, in an Angular *ngIf block, I want to check if keyToFind matches any key within this…
timray
  • 588
  • 1
  • 9
  • 24
5
votes
1 answer

Can't have event on ng-template? Event binding click not emitted by any directive on an embedded template

I am trying to simply use *ngIf ;else to render a button or not but keep getting this error. It seems I can not have an event on my ng-template? This can't be so. I must be doing something obviously wrong. The event name (click) is obviously…
imnickvaughn
  • 2,774
  • 9
  • 25
  • 42
5
votes
1 answer

Angular ngIf firebase authentication directive makes DOM unresponsive

I am using Angular's *ngIf directive to check if a user is currently logged in. Depending on the authentication status of the user(I'm using Firebase authentication), either the log in button or the user menu should show. Here's the code:…
mondieki
  • 1,771
  • 3
  • 16
  • 24
5
votes
2 answers

Angular ng-if vs ng-switch performance

I was thinking which one is faster ng-if or ng-switch? Let's say we have a case: 10 different divs and only one is needed at a time. Is there any difference in speed if ng-switch is used instead of ng-if? If ng-if is used all the elements will be…
Firze
  • 3,939
  • 6
  • 48
  • 61
5
votes
1 answer

Unable to get element by ID within ngIf

I have been playing with A2 for a little while now and I understand that my problem is due to the sequence in which everything initialises and runs within A2 and due to the *ngIf in the html but what I don't understand is why or how to get my…
Doug
  • 547
  • 10
  • 23
5
votes
4 answers

Using ngSwitch on a numeric range in Angular 2

I have recently started learning Angular2. I want to know if there is a possibility to use ngSwitch or ngIf angular2 directives for a specific numeric range? Say I want to update the color of some text based on a range. <25 = Mark the text in…
this-Me
  • 2,139
  • 6
  • 43
  • 70
5
votes
1 answer

ng-if resulting in an infinite loop

First a brief description of what I want to do: I want to iterate through the elements of an array and displaying its content. Based on the information I get from the element inside the array, I want to show a button- or not. But this seems not to…
Karlo Kraljic
  • 173
  • 2
  • 11
5
votes
3 answers

AngularJS directive within ng-if won't run

I have a custom directive myDirective that performs a task on an element. I have this directive in an ng-if block
Something like this fiddle: http://jsfiddle.net/hGnvv/ only the ng-if…
5
votes
3 answers

ng-if or ng-checked matching from comma separated value

I have following HTML Example - example-ngModel-getter-setter-production
Muzafar Khan
  • 826
  • 3
  • 15
  • 28
5
votes
1 answer

angularjs directive's '$element' is a comment because of ng-if

I'm trying to build a popup (dialog) directive for my angularjs application. (still lots todo...) However I made a template file which builds the popup element, with insertion of values from the attributes passed with the directive element. The…
4
votes
3 answers

*ngIf with a NOT (!) with async pipe for BehaviorSubject or Promise throws condition error

*ngIf for async NOT condition? So I have a fairly simple login service that uses the behavior subject library to know when a user is logged in. login.service.ts: constructor(private http: HttpClient){ this.loggedSubject = new…
4
votes
1 answer

Custom *ngIf with an else template but no conditional @Input()

So I have a custom ngIf directive that I'm using to handle user authorization, but now I want to make one for certain roles so that I don't have to keep providing them. Essentially I want to turn this:
LoganBlack
  • 254
  • 2
  • 14
4
votes
1 answer

Is it ok to use the function Map.prototype.get() inside an Angular Template Expression?

I know that you should never use function calls within Angulars Template Expressions, otherwise they will be called permanently and the app will be extremely stressed. (see Medium - Why You Should Never Use Function Calls In Angular Template…
marvinfrede
  • 1,055
  • 5
  • 12