Conditional Rendering with @if
Show content conditionally with @if and @else.
Built-in Control Flow
Modern Angular templates include built-in control flow blocks written with an at-symbol. They replace the older structural directives and need no imports.
The if Block
The at-if block conditionally renders content. You write an at-symbol followed by the word if, the condition in parentheses, and the content in curly braces.
// template:
// @if (loggedIn) {
// <p>Welcome back!</p>
// }All lessons in this course
- Conditional Rendering with @if
- Looping with @for
- Switching with @switch
- Deferred Loading with @defer