Transformando Signal Forms em tools de agente de IA

O Angular consegue expor sozinho um Signal Form como uma tool que um agente de IA preenche e envia, com a validação do próprio form guardando a chamada, então o agente se corrige em vez de mandar lixo. Isso faz parte do WebMCP, que é experimental, então a API pode mudar entre minors. A fonte primária é next.angular.dev/ai/webmcp.

O que você ganha de verdade

Essa é a fatia mais demonstrável do WebMCP no Angular: em vez de escrever uma tool na mão com um JSON schema e um callback execute, você deixa um Signal Form que já existe virar a tool. Adicione o provideExperimentalWebMcpForms() de @angular/forms/signals aos seus providers, passe a opção experimentalWebMcpTool para o form(), e o Angular liga o resto.

A parte boa está no que o form já carrega. O Angular infere o JSON schema da tool a partir dos valores iniciais do modelo, e conecta a validação e o submit do form na chamada. Quando o agente preenche a tool, os validadores que você já escreveu rodam; o agente enxerga os erros de campo e consegue se corrigir, em vez de empurrar um payload meio-válido para o seu handler de submit. As mesmas regras de required que protegem uma pessoa digitando no form passam a proteger o agente que o chama.

Eu leio isso como o form virando um contrato que o agente precisa cumprir, e não uma superfície que ele fica cutucando. Você escreve o form uma vez, para pessoas, e o agente ganha a versão validada de graça.

Um Signal Form exposto como toolts
// provideExperimentalWebMcpForms() precisa estar nos seus providers
readonly model = signal({ firstName: '', lastName: '' });

readonly userForm = form(this.model,
  (f) => {
    required(f.firstName, { message: 'First name is mandatory.' });
    required(f.lastName, { message: 'Last name is mandatory.' });
  },
  {
    experimentalWebMcpTool: { name: 'registerUser', description: 'Registers a new user.' },
    submission: { action: async (formValue) => { /* ... */ } },
  },
);

O que a inferência de schema precisa

Essa conveniência tem um preço, e ele está no modelo. O Angular lê o formato do schema da tool a partir dos valores iniciais do modelo, então esses valores precisam ser concretos o bastante para dar para ler um tipo deles. Não existe um schema separado que você corrige na mão; o modelo é o schema.

Três restrições saem daí. A primeira: todo campo precisa de um valor inicial concreto ('', 0, false), nunca null ou undefined, porque não dá para inferir um tipo a partir de null. A segunda: arrays precisam de pelo menos um elemento para o formato do item ser conhecido. A terceira: validadores assíncronos não rodam durante o submit do agente, então aquilo que você só garante de forma assíncrona não vai barrar o agente.

Leia a tabela como o custo de pular um schema escrito na mão. Se um campo não consegue dar um valor inicial limpo, é nesse campo que você precisa pensar antes de expor o form.

Campo do modeloInferido comoPegadinha
name: ''stringTranquilo. Uma string vazia ainda é lida como string.
age: 0numberTranquilo, mas 0 é um valor padrão de verdade, não um 'não preenchido'.
active: falsebooleanTranquilo. false é lido como boolean.
tags: []array de desconhecidoPrecisa de pelo menos um elemento para o formato do item ser conhecido; um array vazio esconde isso.
role: nullnão dá para inferirNenhum tipo sai de null; dê um valor padrão concreto como ''.

Onde isso merece existir, e onde eu esperaria

Eu usaria isso em forms internos e de admin que um agente conduz: um registro de back-office que um operador preencheria na mão, ou uma ação em lote atrás de uma flag, onde o form já tem uma boa validação e o raio de impacto é pequeno. Ali é genuinamente útil, e a validação guardando a chamada é a feature, não um detalhe de rodapé.

Eu esperaria em envios voltados ao usuário e em fluxos regulados. A metade dos forms está resolvida agora: Signal Forms são estáveis desde o Angular 22. A metade do agente não. O WebMCP é experimental, um draft de Community Group do W3C, e a doc avisa que as APIs podem mudar fora de major versions. O motivo mais profundo é que o Angular não valida que as entradas do agente batem com o schema inferido; você ainda valida dentro do submit para qualquer coisa que importe. Então é uma camada experimental agora, não duas: eu adotaria Signal Forms sozinhos antes de confiar na camada de agente em cima num fluxo de receita.

Artefato para reaproveitar

Checklist de prontidão para form como tool

  • Dê a todo campo do modelo um valor inicial concreto ('', 0, false), nunca null ou undefined.
  • Semeie todo array com pelo menos um elemento para o Angular conseguir inferir o formato do item.
  • Não conte com validadores assíncronos para barrar o agente; eles não rodam durante o submit do agente.
  • Valide as entradas dentro da ação de submit para qualquer coisa que importe; o schema inferido não é imposto.
  • Mantenha os primeiros alvos em forms internos ou de admin que um agente conduz, atrás de uma flag.
  • Trate a tool como experimental e recheque a API a cada minor do Angular, não só nos majors.

Perguntas frequentes

Como um Signal Form vira uma tool de agente de IA?

Adicione o provideExperimentalWebMcpForms() aos seus providers e passe a opção experimentalWebMcpTool para o form(). O Angular infere o JSON schema da tool a partir dos valores iniciais do modelo e conecta a validação e o submit do form, então o agente enxerga os erros de campo e se corrige. Fonte: next.angular.dev/ai/webmcp.

Por que um campo não pode ser null no modelo?

O Angular infere o schema a partir dos valores iniciais do modelo, e não dá para inferir um tipo a partir de null ou undefined. Dê a cada campo um valor padrão concreto como '', 0 ou false, e semeie arrays com pelo menos um elemento para o formato do item ser conhecido.

A validação do form protege a chamada do agente?

A validação síncrona protege. O agente enxerga os mesmos erros de campo que uma pessoa veria e consegue se corrigir antes de enviar. Validadores assíncronos não rodam durante o submit do agente, e o Angular não impõe o schema inferido, então valide as entradas dentro da ação de submit para qualquer coisa que importe.

Dá para colocar isso em produção para usuários?

Eu esperaria, mas por um motivo mais estreito que antes. Signal Forms são estáveis no Angular 22, então a metade dos forms está resolvida; o WebMCP é a parte que ainda é experimental, com a doc avisando que as APIs podem mudar fora de major versions. Eu usaria em forms internos ou de admin atrás de uma flag e deixaria fora de envios voltados ao usuário ou regulados por enquanto.

Fontes consultadas

Modern Angular Playbook

Este artigo é um play.

O Playbook do Angular Moderno reúne o diagnóstico, a matriz de adoção, onze jogadas e o plano de 30 dias. Grátis, em inglês e português.

Você recebe os dois PDFs por email, pela lista do Dojo IA.

Abrir playbook →

André Ramosdisponível para vagas remotas, UTC−3Entre em contato →

Leia também

Nota · 6 min

WebMCP vs Angular CLI MCP server: tools em runtime vs ajuda em dev-time

Qual MCP do Angular você quer de verdade: o CLI MCP server de dev-time, que ajuda um assistente a escrever seu código, ou o WebMCP de runtime, que deixa um agente do browser chamar seu app publicado.

Ler artigo →

Guia · 12 min

WebMCP no Angular: como expor tools ao agente de IA do browser (e quando esperar)

Como o Angular expõe tools WebMCP para um agente de IA do browser (bootstrap, rotas, services e Signal Forms), mais a superfície de segurança que se abre e onde eu ainda esperaria antes de colocar em produção.

Ler artigo →

Guia · 8 min

Segurança de WebMCP no Angular: o agente que chama suas tools pode ser sequestrado

Um guia de segurança para o WebMCP do Angular: por que uma tool exposta age com a autoridade do usuário, por que o JSON schema não é fronteira de confiança, e as defesas antes de expor qualquer coisa que altera dado.

Ler artigo →