Discussion :

[olivier252]

Bonjour,

Je rencontre cette erreur dans un controller qui gère un formulaire quand je récupère la valeur de chaque champ

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
export class FormBookComponent implements OnInit {
  bookForm!: FormGroup;
 
  constructor(
    private formBuilder: FormBuilder,
    private bookService: BookService,
    private router: Router) { }
 
  ngOnInit(): void {
    this.initFormBook();
  }
 
  initFormBook() {
    this.bookForm = this.formBuilder.group({
        title: ['', Validators.required],
        author: ['', Validators.required]
    })
  }
 
  onSubmitBookForm() {
//erreur ici: Object is possibly 'null'.ts(2531) sur const title et const author
    const title= this.bookForm.get('title').value;
    const author = this.bookForm.get('author').value;
 
..........
}

Je ne comprends pas pourquoi je dois mettre aussi l'opérateur d'assetion "!" non null systématiquement sur toutes les variables de classes (ici "bookForm") alors qu'auparavant je n'avais pas besoin de faire ça. De plus je suppose que ça n'est pas très recommandé en cas de nullité justement

Merci

[dukoid]

enlève le : !


il faut toujours déclarer: ReactiveFormsModule, dans le module du composant
ou s'il n'y en a pas, dans app.module

[olivier252]

Merci pour ta réponse

Le ReactiveFormModule est bien déclaré dans app.module dans mon cas.
Par contre, si j'enlève le "!" angular me demande d'initialiser ce que je n'avais pas à faire avant, il faut dire que je travaillais sur une vieille version d'angular (6)

[krakatoa]

supprime le dossier node_module
npm i

[olivier252]

Salut,

J'ai supprimé le dossier mais rien de concluant j'ai toujours le :

Property 'bookForm' has no initializer and is not definitely assigned in the constructor.ts(2564)

[dukoid]

(1) et avec : this.initFormBook(); dans le constructor ?

(2)
c de l'angular 6 ?

(3)
c'est bien : @angular/forms
import { ReactiveFormsModule } from '@angular/forms';

(4)
sinon essaye le meme code dans un autre composant