Chapter quiz · Templates & Data Binding

Test what you learned.

8 questions on Templates & Data Binding. Pass 70% to clear the chapter.

← Review chapter lessons

Quiz

Templates & Data Binding — Chapter Quiz

Eight questions on interpolation, bindings, control flow, and pipes.

0/ 9

Question 1
1
Which is the correct syntax for property binding to a DOM attribute?
A{{ disabled }}B[disabled]="isOff"C(disabled)="isOff"Ddisabled="{{ isOff }}"
Square brackets bind a DOM property to an expression. Parens are for events; curly braces interpolate text.
Question 2
2
What does (click)="save()" do?
ASets the click property to the string "save()"BBinds the click event to the save methodCDefines a custom click directiveDCalls save() every change-detection cycle
(event)="handler($event)" is event binding. The handler runs whenever the event fires, not on every CD cycle.
Question 3
3
Which built-in pipe formats a Date for display?
AformatBdateCtimeDstringify
{{ someDate | date:'short' }} formats a Date. Other built-ins include currency, percent, json, and async.
Question 4
4
What is the two-way binding syntax called?
ABox of bananasBBanana in a boxCCurly hatDHash-tag binding
[(ngModel)]="x" — banana (the parens) in a box (the brackets). It combines property and event binding into one expression.
Question 5
5
<ng-container> is used to:
ARender an extra DOM wrapper around contentBGroup elements logically without adding a DOM nodeCProject content from a parent componentDDefine a reusable template that can be stamped out
<ng-container> is invisible at runtime — useful for applying a structural directive to a group of elements without an extra wrapper.
Question 6
6
@if, @for, and @switch are the modern replacements for *ngIf, *ngFor, and *ngSwitch.
TTrueFFalse
Control-flow blocks landed in Angular 17. They are faster, compile-time checked, and don't need the CommonModule imports.
Question 7
7
In @for (item of items; track item.id), the track expression should be a unique ___.
track lets Angular diff the list efficiently. Use a stable, unique identifier per item — usually item.id.
Question 8
8
Which control-flow keywords are valid in Angular 17+ templates?
Select all that apply.
A@ifB*ngIfC@forD@switchE@defer
*ngIf still works (legacy) but isn't a built-in template keyword like the @ blocks. The new built-ins are @if, @for, @switch, @defer (plus the @empty/@else cases).