Angular · Theory

Quiz

Theory

42/43

Quiz

Quiz is a Angular topic. In plain words you use it for a short Quiz example in a campus SPA. Don’t start with a slogan — start with that picture.

Smallest example: the smallest Quiz example you can type. Type it, run it, and say what you see. If you can do that from memory, you know Quiz.

From the example next to this theory — Quiz: toggle open.

Trap — only saying “Quiz” with no example. Fix that before you talk about advanced Angular.

Viva — what is Quiz? Then show the smallest Quiz example you can type. Then name the trap.

Exam tip

What is Quiz? Show this: the smallest Quiz example you can type. Trap: only saying “Quiz” with no example.

Example

import { Component } from "@angular/core";

@Component({
  selector: "app-root",
  template: `
    <h1>{{ title }}</h1>
    <button (click)="toggle()">Toggle</button>
    <p *ngIf="open">Panel open</p>
  `,
})
export class AppComponent {
  title = "Angular practice";
  open = true;
  toggle() {
    this.open = !this.open;
  }
}

Quiz: toggle open. Say whether the panel is on screen after one click.

Short notes

DefQuiz — a short Quiz example in a campus SPA.
Rulethe smallest Quiz example you can type
Traponly saying “Quiz” with no example
Usea campus SPA

import { Component } from "@angular/core"; @Component({ selector: "app-root", template: ` <h1>{{ title }}</h1> <button (click)="toggle()">Toggle</button> <p *ngIf="open">Panel open</p> `, }) export class AppComponent { title = "Angular practice"; open = true; toggle() { this.open = !this.open; } }

Quiz

Example

Short notes

Questions

Quiz

Example

Short notes

Questions