insert form into book
This commit is contained in:
0
src/app/components/create-book/create-book.css
Normal file
0
src/app/components/create-book/create-book.css
Normal file
33
src/app/components/create-book/create-book.html
Normal file
33
src/app/components/create-book/create-book.html
Normal file
@@ -0,0 +1,33 @@
|
||||
<form nz-form nzLayout="horizontal" [formGroup]="authorForm" (ngSubmit)="submitForm()">
|
||||
<nz-form-item>
|
||||
<nz-form-label nzSpan="4" nzRequired>
|
||||
Nom
|
||||
</nz-form-label>
|
||||
|
||||
<nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
|
||||
<input nz-input placeholder="Nom" formControlName="name">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
|
||||
<nz-form-item>
|
||||
<nz-form-label nzSpan="4" nzRequired>
|
||||
Prénom
|
||||
</nz-form-label>
|
||||
|
||||
<nz-form-control nzSpan="20" nzErrorTip="Ce champ est requis">
|
||||
<input nz-input placeholder="Prénom" formControlName="firstname">
|
||||
</nz-form-control>
|
||||
</nz-form-item>
|
||||
|
||||
<nz-flex nzJustify="end">
|
||||
<!-- <button nz-button nzType="primary" (click)="submitForm()">-->
|
||||
<!-- Valider-->
|
||||
<!-- </button>-->
|
||||
|
||||
<button nz-button nzType="primary" type="submit">
|
||||
Valider
|
||||
</button>
|
||||
</nz-flex>
|
||||
</form>
|
||||
|
||||
<button nz-button (click)="fillForm()">Simuler une récupération depuis le serveur</button>
|
||||
28
src/app/components/create-book/create-book.ts
Normal file
28
src/app/components/create-book/create-book.ts
Normal file
@@ -0,0 +1,28 @@
|
||||
import { Component } from '@angular/core';
|
||||
import {NzFormModule} from "ng-zorro-antd/form";
|
||||
import {FormControl, FormGroup, Validators} from "@angular/forms";
|
||||
|
||||
@Component({
|
||||
selector: 'app-create-book',
|
||||
imports: [NzFormModule],
|
||||
templateUrl: './create-book.html',
|
||||
styleUrl: './create-book.css',
|
||||
})
|
||||
export class CreateBook {
|
||||
createBookForm = new FormGroup({
|
||||
title: new FormControl<string>(null, [Validators.required]),
|
||||
releaseYear: new FormControl<string>(null, [Validators.required]),
|
||||
author: new FormControl<string>(null, [Validators.required])
|
||||
})
|
||||
|
||||
submitForm() {
|
||||
// Pour annuler si le formulaire est invalide
|
||||
if (this.createBookForm.invalid) return;
|
||||
|
||||
// Pour obtenir la valeur du formulaire
|
||||
console.log(this.createBookForm.getRawValue())
|
||||
|
||||
// Pour vider le formulaire
|
||||
this.createBookForm.reset()
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user