Get Started — Angular Technical Interview Questions & Answers

Get Started

Get Started

  • Get started means: open the project, find app.component, change the title, save, see the browser refresh. Then add a second component with ng generate component student-card.
  • File map: .ts = logic, .html = mark-up, .css = look. Don’t put SQL in the component. Don’t put all CSS global if it belongs to one card.
  • Trap: editing dist/ instead of src/. Dist is build output. Another trap: skipping generate and copy-pasting a huge Stack Overflow component you can’t read.

Technical Interview Tip: Change title → generate StudentCard → see it on screen.

Code Examples for Get Started

Get Started — working 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;
  }
}

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

How to Explain Get Started to an Interviewer

What files make one component?

.ts logic .html template .css style

How do you add a new component?

ng generate component …