@tanstack/ai-angular weekly downloads statistics

TanStack AI — Angular

Angular signal-based bindings for TanStack AI — streaming chat, tool-calling agents, and media generation built on Angular's native reactivity model.

Read the docs ->

Install

Minimal Usage

Important: All inject* functions use Angular's dependency injection system and must be called within an Angular injection context — a component or directive class field initializer, the constructor, or inside runInInjectionContext. Calling them outside an injection context will throw a runtime error.

The example below shows a standalone component that streams chat messages from a server endpoint via SSE:

All state is exposed as Angular Signals. Read them by calling them as functions:

| Signal | Type | Description |

| chat.messages() | UIMessage[] | Current message list | | chat.isLoading() | boolean | Whether a response is streaming | | chat.error() | Error \| undefined | Last error, if any | | chat.status() | ChatClientState | 'ready', 'streaming', 'error', ... | | chat.isSubscribed() | boolean | Whether a live (SSE push) session is active | | chat.connectionStatus() | ConnectionStatus | Transport connection status |

Available methods on the return value: sendMessage, append, reload, stop, clear, setMessages, addToolResult, addToolApprovalResponse.

Server endpoint

The client pairs with any endpoint that returns a TanStack AI SSE stream:

Available Functions

| Function | Description |

| injectChat | Streaming chat with messages, tool calls, and structured outputs | | injectGeneration | Generic generation client (streaming or one-shot) | | injectGenerateImage | Image generation | | injectGenerateAudio | Audio generation | | injectGenerateVideo | Video generation | | injectGenerateSpeech | Text-to-speech | | injectSummarize | Summarization | | injectTranscription | Audio transcription |

All generation functions return signals (result, isLoading, error, status) and methods (generate, stop, reset).

Injection Context

Angular's DI system requires that inject() is called during component construction. Every inject* function in this package calls inject() internally. Valid call sites:

Get Involved

• Read the docs. • Participate in GitHub discussions. • Chat with the community on Discord. • See CONTRIBUTING.md for setup instructions. • Become a sponsor.

Description from the npm listing.