Modern Angular
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.
// 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 modelo | Inferido como | Pegadinha |
|---|---|---|
name: '' | string | Tranquilo. Uma string vazia ainda é lida como string. |
age: 0 | number | Tranquilo, mas 0 é um valor padrão de verdade, não um 'não preenchido'. |
active: false | boolean | Tranquilo. false é lido como boolean. |
tags: [] | array de desconhecido | Precisa de pelo menos um elemento para o formato do item ser conhecido; um array vazio esconde isso. |
role: null | não dá para inferir | Nenhum 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), nuncanullouundefined. - 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
- https://next.angular.dev/ai/webmcp
- https://angular.dev/guide/forms/signals/overview
- https://webmachinelearning.github.io/webmcp/
- https://next.angular.dev/api/core/provideExperimentalWebMcpTools
- https://angular.dev/reference/releases
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.
André Ramosdisponível para vagas remotas, UTC−3Entre em contato →