Что такое сигналы
Разберитесь в сигналах как в контейнерах реактивного состояния.
«Что такое сигналы» — бесплатный урок Angular Academy на CoddyKit. Это урок 1 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Angular Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Angular Academy содержит 4 уроков всего.
Что такое сигналы?
Сигнал — это реактивный примитив, появившийся в современных версиях Angular. Он представляет собой оболочку вокруг значения, которая может уведомлять заинтересованных потребителей об изменении этого значения.
Сигналы делают реактивность Angular явной, детализированной и понятной.
Почему важна реактивность
В пользовательском интерфейсе экран должен оставаться синхронизированным с данными. Когда данные меняются, представление должно обновляться.
Сигналы позволяют Angular точно определить, что именно изменилось и что от этого зависит, поэтому обновляются только затронутые части представления.
Проблема до появления сигналов
Раньше Angular полагался на Zone.js и широкое обнаружение изменений: после любого асинхронного события Angular повторно проверял большие части дерева компонентов.
Это работает, но может быть неэффективно. Сигналы обеспечивают точечные обновления без проверки всего дерева.
Сигнал хранит значение
Представьте сигнал как умную коробку вокруг значения. Вы можете прочитать её содержимое и заменить его.
При чтении сигнала также фиксируется, кто его читает, чтобы позднее можно было обновить зависимые элементы.
import { signal } from '@angular/core';
const count = signal(0);
// count is now a signal holding the number 0Чтение — это вызов функции
Главная идея такова: чтобы прочитать сигнал, вызовите его как функцию. Круглые скобки сообщают Angular, что вы читаете текущее значение.
const count = signal(0);
console.log(count()); // 0 <-- note the ()Сигналы работают синхронно
Чтение сигнала происходит синхронно и всегда немедленно возвращает текущее значение. Вам не нужны подписка, асинхронный канал или ручная отписка.
Изменяемые и вычисляемые сигналы
Базовый сигнал, созданный с помощью signal(), является изменяемым: его значение можно менять.
Существуют также вычисляемые сигналы (производные значения) и эффекты (побочные эффекты), построенные на основе изменяемых сигналов.
Сигналы отслеживают зависимости
Когда вычисляемое значение или шаблон читает сигнал, Angular автоматически записывает эту зависимость.
Позднее, если сигнал изменится, будут пересчитаны только зависимые от него элементы. Благодаря этому сигналы эффективны.
Обновления без промежуточных состояний
Сигналы спроектированы так, чтобы работать без промежуточных состояний: потребители всегда видят согласованное значение и не получают уведомлений о частично обновлённом состоянии.
Это делает сложные реактивные графы предсказуемыми.
Где находятся сигналы
Сигналы входят в состав @angular/core. Импортируйте оттуда signal, computed и effect.
Их можно использовать в компонентах, службах и любом коде TypeScript.
import { signal, computed, effect } from '@angular/core';Сигналы в компоненте
Распространённый подход — объявить сигналы как поля класса компонента, а затем читать их в шаблоне.
import { Component, signal } from '@angular/core';
@Component({ selector: 'app-counter', template: '' })
export class CounterComponent {
count = signal(0);
}Быстрая проверка: основы сигналов
Проверим, насколько хорошо вы поняли, что такое сигнал.
Повторение: что такое сигналы
Вы узнали, что сигнал — это реактивная оболочка вокруг значения, которая уведомляет потребителей об изменении. Сигнал можно прочитать, вызвав его с круглыми скобками; чтение выполняется синхронно, а сигналы обеспечивают точечные обновления без промежуточных состояний.
Далее вы создадите собственные сигналы и научитесь их читать.
Часто задаваемые вопросы
Урок «Что такое сигналы» бесплатный?
Да — полный текст урока «Что такое сигналы» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Angular Academy, подпишись на CoddyKit PRO. Курс Angular Academy содержит 4 уроков всего.
Чему я научусь в уроке «Что такое сигналы»?
Разберитесь в сигналах как в контейнерах реактивного состояния. Ты практикуешь Angular Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.
Нужен ли мне опыт, чтобы начать Angular Academy?
Предыдущий опыт не требуется. Angular Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 1 из 4.
Сколько времени занимает урок «Что такое сигналы»?
Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.
Можно ли писать и запускать код в этом уроке Angular Academy?
Да. Каждый урок Angular Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.
Все уроки этого курса
- Что такое сигналы
- Создание и чтение сигналов
- Обновление сигналов с помощью set и update
- Сигналы в шаблонах