I’m somewhat new to angular, mostly coming over from react.

Needing to submit a form to backend, my current and in my opinion simplest solution is as follows:

<form (submit)="submitPost($event)" method="post" enctype="multipart/form-data">
    <label for="author">Username:</label>
    <input type="text" name="author" required />
    <label for="content">Post:</label>
    <textarea name="content" required ></textarea>
    <label for="image">Upload an image (optional):</label>
    <input type="file" name="image" />
    <button type="submit">Submit</button>
</form>

async submitPost(event: any) {
    const formData = new FormData(event.target);

    await fetch(`${this.backendEndpoint}/api/v1/create-post`, {
        method: 'POST',
        body: formData
    });
}

I looked for guides and it was mostly with ReactiveForms, which would need me to manually create an object with properties for each field (which didn’t even bind file input correctly, so additional boilerplate would be needed to set the file) or with ngModel, which (to me) has the same inconvenience of manually writing out class fields for each of the form input.

Would my approach be considered bad practice in the proffessional industry and if so what would be the optimal solution with industry best practices?