AG-UI · API Reference

provideAgent()

provideAgent() registers the singleton AG-UI agent configuration for every injectAgent() call in an Angular application. Call it once in bootstrapApplication or an ApplicationConfig to wire up the endpoint URL, optional identifiers, custom headers, and telemetry.

injectAgent() itself takes no arguments — all configuration flows through provideAgent().

import { bootstrapApplication } from '@angular/platform-browser';
import { provideAgent } from '@threadplane/ag-ui';
import { AppComponent } from './app/app.component';
 
bootstrapApplication(AppComponent, {
  providers: [
    provideAgent({
      url: 'http://localhost:8000/my-agent',
    }),
  ],
});

#Configuration options

OptionTypeDescription
urlstringHTTP endpoint for the AG-UI backend agent. Required.
agentIdstringOptional agent identifier forwarded to the backend.
threadIdstringOptional thread identifier for session continuity.
headersRecord<string, string>Optional custom HTTP headers included on every request.
telemetryAgentRuntimeTelemetrySink | falseOptional app-owned telemetry sink. No telemetry is emitted unless this is provided.

#Static vs factory config

Pass a plain AgentConfig object when the URL is known up front. Pass a () => AgentConfig factory when the config depends on runtime DI state — the factory runs inside an Angular injection context, so it may call inject() to read services or environment tokens.

// Factory form — reads an environment token at runtime
provideAgent(() => {
  const env = inject(APP_ENV);
  return {
    url: env.agentUrl,
    headers: { Authorization: `Bearer ${env.apiKey}` },
  };
});

#Singleton model

A single provideAgent({...}) call configures the entire application. Every injectAgent() call resolves to the same configured agent.

provideAgent({ url: 'https://api.example.com/agent' });
 
// Elsewhere, inside an injection context:
const chat = injectAgent();

#What's Next