Property 'name' comes from an index signature, so it must be accessed with ['name'].

<div class="admin-page">
    <p-card header="Ajouter Catégories" subheader="Ajouter ou Modifier les catégories ici">
        <div class="p-grid" [ngStyle]="{ 'margin-bottom': '25px' }">
            <div class="col-12">
                <p-toolbar>
                    <div class="p-toolbar-group-left"></div>
                    <div class="p-toolbar-group-right">
                        <p-button styleClass="p-button-primary" [ngStyle]="{ 'margin-right': '12px' }" label="Créer" icon="pi pi-plus" (click)="onSubmit()">
                        </p-button>
                        <p-button styleClass="p-button-secondary" label="Annuler" icon="pi pi-arrow-circle-left" routerLink="form"> </p-button>
                    </div>
                </p-toolbar>
            </div>
        </div>
        <div class="p-grid">
            <div class="col-12">
                <form [formGroup]="form">
                    <div class="formgrid grid">
                        <div class="field col">
                            <label for="name">Nom</label>
                            <input
                                formControlName="name"
                                id="name"
                                type="text"
                                class="text-base text-color surface-overlay p-2 border-1 border-solid surface-border border-round appearance-none outline-none focus:border-primary w-full"
                            />
                            <small class="p-error" *ngIf="categoryForm.name.invalid && isSubmitted">Nom requise</small>
                        </div>
                        <div class="field col">
                            <label for="icon">Icone</label>
                            <input
                                formControlName="icon"
                                id="icon"
                                type="text"
                                class="text-base text-color surface-overlay p-2 border-1 border-solid surface-border border-round appearance-none outline-none focus:border-primary w-full"
                            />
                            <small class="p-error" *ngIf="categoryForm.icon.invalid && isSubmitted">Icone requise</small>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </p-card>
</div>

import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { CategoriesService, Category } from '@kartel/products';

@Component({
    selector: 'kartel-categories-form',
    templateUrl: './categories-form.component.html',
    styles: []
})
export class CategoriesFormComponent implements OnInit {
    form: FormGroup;

    isSubmitted: boolean = false;

    constructor(private formBuilder: FormBuilder) {}

    ngOnInit(): void {
        this.form = this.formBuilder.group({
            name: ['', Validators.required],
            icon: ['', Validators.required]
        });
    }

    onSubmit() {
        this.isSubmitted = true;
        if (this.form.invalid) {
            return;
        }
        console.log(this.form.controls.name.value);
        console.log(this.form.controls.icon.value);
    }
    get categoryForm() {
        return this.form.controls;
    }
}