Latihan 1 dari materi State Management Angular di Angular — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Starter-nya sudah punya import { Injectable } from '@angular/core' dan export class TodoStore {} yang kosong. Isi jadi signal store:
signal dan computed ke import: import { Injectable, signal, computed } from '@angular/core'.@Injectable({ providedIn: 'root' }).private items = signal<string[]>([]): daftar yang mulai kosong.readonly todoItems = this.items.asReadonly(): versi baca saja untuk pemakai luar.readonly count = computed(() => this.items().length): jumlahnya, diturunkan dari panjang daftar dan dibaca dengan count().addItem(item: string) yang menjalankan this.items.update(list => [...list, item]).removeItem(index: number) yang menjalankan this.items.update(list => list.filter((_, i) => i !== index)).Yang dicek:
signal< (atau signal(), computed(, dan @Injectable.asReadonly(), atau readonly todoItems = computed(() => this.items()). count saja gak dihitung.addItem('x'), store-nya punya daftar baca saja (tanpa .set) yang berisi ['x'].count() bernilai 0.addItem('a'), addItem('b'), dan removeItem(0), count() bernilai 1.addItem dan removeItem masing-masing memanggil .update( atau .set(.computed( memakai .length dari daftarnya.
