Skip to content

Commit

Permalink
Merge pull request #555 from kabrunko-dev/docs/translate-challenge-41
Browse files Browse the repository at this point in the history
docs(pt): translate challenge 41
  • Loading branch information
tomalaforge authored Feb 2, 2024
2 parents c25997a + 3121fc7 commit 4ae3729
Showing 1 changed file with 41 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
---
title: 🟠 Control Value Accessor
description: Desafio 41 é sobre criar um controle personalizado de formulário que implemente a interface Control Value Accessor.
author: stanislav-gavrilov
challengeNumber: 41
command: forms-control-value-accessor
sidebar:
order: 1
---

## Informação

Neste desafio, o objetivo é criar um campo personalizado de formulário que use a Form API do Angular `ControlValueAccessor`. Você pode achar a documentação [aqui](https://angular.io/api/forms/ControlValueAccessor). A interface é crucial para criar controles personalizados de formulário que interaja de forma transparente com a API dos formulários do Angular.

## Declaração

O objetivo principal é usar controle no `feedbackForm` para eliminar a necessidade de uso do `@Output` afim de recuperar o valor e injetar ele no `FormGroup`.
Além disso, você é obrigado a integrar validação para o novo controle afim de assegurar que os dados de avaliação existam. (O botão de submissão do formulário deve ser desabilitado se o formulário é inválido).

Atualmente, a avaliação é programada desta maneira:

```html
<app-rating-control (ratingUpdated)="rating = $event"></app-rating-control>
```

```ts
rating: string | null = null;

onFormSubmit(): void {
this.feedBackSubmit.emit({
...this.feedbackForm.value,
rating: this.rating, // fora do FormGroup e sem validação
});
}
```

O objetivo é incluir a avaliação no `FormGroup`

```html
<app-rating-control [formControl]="feedbackForm.controls.rating"></app-rating-control>
```

0 comments on commit 4ae3729

Please sign in to comment.