სიგნალები
რა არის სიგნალები?
Angular Signals არის სისტემა, რომელიც თვალს ადევნებს სად არის ჩვენი აპლიკაციის სთეითი და როგორ იცვლება ის. შედეგად ანგულარი ოპტიმიზირებულად არენდერებს თემფლეითებს.
სიგნალი არის ერთგვარი მნიშვნელობის შემფუთველი, რომელიც აცნობებს დაინტერესებულ კონსუმერებს, როდის იცვლება ეს მნიშვნელობა. სიგნალებში შესაძლებელია ნებისმიერი მნიშვნელობის შენახვა, მარტივი პრიმიტივებიდან კომპლექსური მონაცემის სტრუქტურებამდე.
Writable Signals
მოდიფიცირებადი სიგნალები გვაწვდიან API-ს მათი მნიშვნელობების გასაახლებლად.
სიგნალები იქმნება signal
ფუნქციით (angular/core
-დან), რომელსაც საწყისი მნიშვნელობა უნდა მივაწოდოთ.
count = signal(0);
ასეთი სიგნალის ტიპი არის WritableSignal
.
თემფლეითში ამ მნიშვნელობის გამოსატანად ჩვენ count
-ს ფუნქციასავით ვეძახით:
<button>Count: {{ count() }}</button>
სიგნალის მნიშვნელობის შესაცვლელად შეგვიძლია მასზე set
მეთოდს დავუძახოთ:
<button (click)="count.set(3)">Count: {{ count() }}</button>
თუ მნიშვნელობის განახლება გვინდა, მაგრამ ამისთვის სიგნალის წინა მნიშვნელობა გვჭირდება,
მაშინ update
მეტოდი გამოგვადგება, სადაც ქოლბექში წინა მნიშვნელობას ვიღებთ და შეგვიძლია
ახალი დავაბრუნოთ:
count.update((value) => value + 1)
Computed Signals
გამოთვლილი სიგნალები არიან არამოდიფიცირებადი სიგნალები, რომლებიც მნიშვნელობას სხვა სიგნალებიდან გამომდინარე ატარებენ:
@Component({
template: `
<button (click)="increment()">Count: {{ count() }}</button>
<p>Is even: {{ isCountEven() }}</p>
`,
})
export class AppComponent {
count = signal(0);
isCountEven = computed(() => this.count() % 2 === 0);
increment() {
this.count.update((value) => value + 1);
}
ამ მაგალითში isCountEven
ეყრდნობა count
სიგნალს.
count
-ის მნიშვნელობის შეცვლასთან ერთად სათანადოდ შეიცვლება isCountEven
.
გასათვალისწინებელია, რომ გამოთვლილი სიგნალი არ არის მოდიფიცირებადი,
ComputedSignal
ტიპიზე არ არსებობს set
და update
მეთოდები.
გამოთვლილი სიგნალები ზარმაცად მუშაობენ. ისინი იმ შემთხვევაში აწარმოებენ კალკულაციას, თუ სიგნალი, რომელზეც ისინი ეყრდნობიან, შეიცვალა. სხვა შემთხვევაში ხდება პირვანდელი გამოთვლილი მნიშვნელობის ქეშირება და, სიგნალზე დაძახების შემთხვევაში, ამ ქეშის აღდგენა.
Effects
თუ სიგნალები ხელსაყრელია, რადგან ისინი დაინტერესებულ კონსუმერებს აცნობებენ ცვლილებებს, ეფექტები გამოსადეგია მაშინ, როცა ჩვენ ერთი ან მეტი სიგნალის ცვლილებაზე გვინდა ისე ვირეაგიროთ, რომ აპლიკაციის სთეითი არ შეიცვალოს (გამოთვლილი სიგნალებისგან განსხვავებით).
export class AppComponent {
count = signal(0);
constructor() {
effect(() => {
console.log(`The count was updated to ${this.count()}`)
})
}
}
აქ ჩვენ ეფექტს ვქმნით, რომელიც გაეშვება, როცა count
სიგნალი მნიშვნელობას შეიცვლის.
ეფექტები ყოველთვის ეშვება მინიმუმ ერთხელ. როცა ეფექტი ეშვება, ის თვალყურს ადევნებს
ყველა მისთვის საჭირო სიგნალს და ყოველ ცვლილებაზე ხელახლა ეშვება.
ეფექტები ფუნქციონირებას წყვეტენ, როცა კომპონენტი ნადგურდება.