Counter with LocalStorage - Angular Typing CST Test

Counter with LocalStorage — Angular Code

Stores the counter value in localStorage to persist across page reloads in Angular.

import { Component, OnInit } from '@angular/core';

@Component({
	selector: 'app-localstorage-counter',
	template: `
	<div>
		<h2>Counter: {{ count }}</h2>
		<button (click)="increment()">+</button>
		<button (click)="decrement()">-</button>
		<button (click)="reset()">Reset</button>
	</div>
	`
})
export class LocalStorageCounterComponent implements OnInit {
	count = 0;
	ngOnInit() { this.count = parseInt(localStorage.getItem('count') || '0', 10); }
	increment() { this.count++; this.save(); }
	decrement() { this.count--; this.save(); }
	reset() { this.count = 0; this.save(); }
	save() { localStorage.setItem('count', this.count.toString()); }
}

Angular Language Guide

Angular is a platform and framework for building client-side web applications using HTML, CSS, and TypeScript. Developed by Google, it is designed for building single-page applications (SPAs) with rich user interfaces and reactive features.

More Angular Typing Exercises

Practice Other Languages