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.
angular-ng-if
1,238
questions
1
vote
1
answer
36
views
Angular ng-content inside *ngIf="false" triggers OnInit's child?
With angular (17 or 18)
<ng-content> must not be rendered inside an *ngIf="false"
But content child OnInit is triggered !?
For test, I tried :
<div class="content" *ngIf=&...
- 11
0
votes
1
answer
62
views
Error NG0303 Can't bind to '*ngIf' since it isn't a known property of 'nav' - Angular 18
I am creating a project in Angular 18. For now, I am only working on the frontend, but I need to create a "test" login. The problem I have is that the navbar was showing in my "login&...
1
vote
0
answers
61
views
Inconsistent *ngIf behaviour when I initialise objects using data in URL fragment
I am creating a fairly simple Angular SPA search tool where users can manually enter search fields, or fields can be auto-populated by pulling data (e.g. search string and search type) out of a URL ...
- 13
1
vote
1
answer
82
views
Angular 17 ngIf accepts boolean only?
I had a working Angular app and now it seems that there is a breaking change and *ngIf accepts only boolean values, not casting falsy/truthy values to boolean.
However, I could not find anything in ...
- 494
0
votes
1
answer
38
views
How to Conditionally Display a Component Using combineLatest in RxJS Without Null Errors?
I want to display a component in my template only if both of my observables do not emit null or undefined.
I use the combineLatest operator from RxJS to simplify the conditional rendering. However, I ...
- 353
1
vote
1
answer
200
views
*ngIf and ngmodel is not working on .html pages
I'm using following versions in Angular, Angular CLI: 17.3.4, Node: 20.9.0, Package Manager: npm 10.5.2. When I'm using *ngIf or ngmodel on .html pages in a component, I'm getting following error ...
- 223
1
vote
1
answer
45
views
Conditional Form rendering in Ionic Angular
I'm trying to use the same component to edit some info with two different classes, is there a way to make it work?
component:
@Component({
selector: 'live-care-monorepo-editutente',
standalone: ...
1
vote
2
answers
107
views
Making an if statement with currently selected option
I have the following drop-down list on my angular JS page:
<div class="col-md-4 fieldMargin">
<div class="dropdownIcon">
...
- 751
0
votes
1
answer
108
views
My Angular *ngif-condition doesn't work. It look okay, I cant find any error
If the myFavorites.length is 0, I want it shows the following message:
"There are no added movies in the Favorites."
Otherwise, the main content (movieList) will be shown.
<div class=&...
1
vote
0
answers
271
views
Angular 17 - should I switch from non-async pipe to async in *ngIf? Variable in ngIf is not updated anymore
After upgrading Angular, I noticed that my component is displayed even if it should't.
<component-name *ngIf="!logged"></component-name>
logged == false, and it doesn't render ...
- 21
0
votes
0
answers
39
views
Taken to top of content when using ngFor inside an ngIf
I have a reorder section inside a food ordering app, the orders are paginated from backend and are loaded using ion-inifite-scroll. I have two buttons which show me delivered orders and upcoming ...
- 56
0
votes
0
answers
32
views
Error:Cannot read properties of null in Angular addressForm is not getting data
<ng-template #addressSection let-addressForm="form" let-resetCityMethod="resetCityMethod" let-address="address">
Street Address*
<input type="text&...
0
votes
2
answers
192
views
Error "TS2339 Property 'elseblock' does not exist on type ''"
I'm trying to do an If Else with Angular:
<form [formGroup]="searchForm">
<input formControlName="search" placeholder="search show"/>
</form>
<...
- 41
1
vote
1
answer
320
views
Is it possible to display a Bootstrap 5 modal popup in Angular using an ngIf condition?
The challenge here arises from the fact that when using ngIf to conditionally display the modal, the modal element is not present in the DOM initially when the page is loaded because by default it is ...
- 29
0
votes
0
answers
49
views
testing *ngIf someObservable piped to async in angular template
How do i test using jest that the template displays/hides the expected elements when they are subscribed/unsubscribed using the *ngIf with the async pipe?
` <ng-content *ngIf="errorStatus$ | ...
- 77