Angular linkedSignal & Resource API

Angular 19 では、Angular アプリケーション内のリアクティブ プログラミングとデータ管理の強化を目的とした 2 つの重要な機能、linkedSignal 関数と Resource API が導入されています。これらの追加機能は、状態の同期と非同期データ処理における既存の課題に対処し、より合理化された効率的なツールを開発者に提供します。

linkedSignal: 強化されたシグナル管理

以前の Angular バージョンでは、他の信号に依存する状態を管理するには複雑な回避策が必要になることがよくありました。開発者は通常、computed() シグナルを使用して、他のシグナルに基づいて値を導出します。ただし、computed() シグナルは読み取り専用なので、他のシグナルに依存したり独立して更新したりできる書き込み可能なシグナルが必要な場合の柔軟性が制限されます。

linkedSignal 関数は、ソース信号の変更に基づいて値を自動的に更新する書き込み可能な信号を作成することで、この問題を解決します。この機能により、信号間の同期が簡素化され、リセット パターンの実装が容易になり、より保守可能で予測可能な状態管理が可能になります。

例:

import { signal, linkedSignal } from '@angular/core';

const sourceSignal = signal(0);
const updatedSignal = linkedSignal({
  source: sourceSignal,
  computation: () => sourceSignal() * 5,
});

この例では、updatedSignal は常にsourceSignal の値の 5 倍になり、sourceSignal の変化に応じて自動的に調整されます。

既存の課題への対処:

linkedSignal が導入される前、開発者は、他のシグナルに依存するシグナルと書き込み可能なシグナルを作成する際に困難に直面していました。これにより、コード構造が複雑になり、エラーが発生する可能性が高まりました。このようなシグナルを作成する簡単な方法を提供することで、linkedSignal はコードの明瞭さを高め、状態管理に関連するバグの可能性を減らします。

リソース API: 合理化されたデータ読み込み

Angular アプリケーションでは、特に HTTP リクエストによる非同期データ読み込みの管理は複雑なタスクでした。開発者は、読み込み、成功、エラー状態などのデータ取得のさまざまな状態を手動で処理する必要があり、その結果、冗長でエラーが発生しやすいコードが生成されることがよくありました。

Angular 19 の Resource API は、特に HTTP GET リクエストのような読み取り操作に対して、リソースをロードするためのリアクティブなアプローチを提供します。これにより、開発者は、データを非同期にフェッチし、現在のステータスを監視してエラーを効果的に処理する信号を提供するローダー関数を定義できます。

例:

import { resource } from '@angular/core';

const productResource = resource({
  loader: async () => {
    const response = await fetch('https://api.example.com/products');
    return response.json();
  }
});

この例では、productResource は、指定された API からデータをフェッチするローダー関数で初期化されます。リソース API は読み込み状態と潜在的なエラーを管理し、データ取得プロセスを簡素化します。

リソース API の主な機能:

• ステータス追跡: ステータス、エラー、isLoading などのシグナルにより、開発者はデータ読み込みプロセスの現在の状態を監視できるため、ユーザー フィードバックやエラー処理が容易になります。ステータス信号には次の値を指定できます。
  • アイドル (0): リソースは初期状態にあり、ロードが開始されていません。
  • エラー (1): 読み込みプロセス中にエラーが発生しました。
  • 読み込み中 (2): リソースは現在データを読み込み中です。
  • リロード中 (3): リソースは通常、前回のロード後にデータをリロードしています。
  • 解決済み (4): リソースはデータを正常にロードしました。
  • ローカル (5): リソースのデータは、新たなロードを行わずにローカルで更新されました。
• ローカル更新: update メソッドを使用すると、新しい読み込みプロセスをトリガーせずに、読み込まれたデータをローカルに変更できるため、データ操作が柔軟になります。
• リクエスト管理: リソース API は、依存する信号が変化すると読み込みプロセスを自動的に再開し、競合状態を防ぐために進行中のリクエストをキャンセルして、データの一貫性と整合性を確保します。

既存の課題への対処:

リソース API が登場する前は、開発者はデータ取得のさまざまな状態を処理するために手動ロジックを実装する必要があり、複雑さが増し、エラーが発生する可能性がありました。 Resource API はこれらの懸念を抽象化し、非同期データ操作を管理するための宣言的かつ簡潔な方法を提供することで、ボイラープレート コードを削減し、アプリケーションの信頼性を向上させます。

結論

Angular 19 での linkedSignal と Resource API の導入は、リアクティブ プログラミングとデータ管理における大幅な進歩を表しています。これらの機能は、状態の同期と非同期データ処理のための、より柔軟で効率的で保守可能なツールを開発者に提供することで、長年の課題に対処します。これらの新機能を活用することで、開発者はパフォーマンスとユーザー エクスペリエンスが強化された最新の Web アプリケーションを作成できます。

以上がAngular linkedSignal & Resource APIの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。