@Alex10214

Что за ошибка при создании переменной типа FormGroup?

Всем привет, есть такой код:
import { Component, OnInit } from '@angular/core';
import {FormControl, FormGroup, Validators} from '@angular/forms';

@Component({
  selector: 'app-login-page',
  templateUrl: './login-page.component.html',
  styleUrls: ['./login-page.component.scss']
})
export class LoginPageComponent implements OnInit {

   loginForm: FormGroup;
 

  constructor(
  ) { }

  ngOnInit(): void {
   
    this.loginForm = new FormGroup({
      email: new FormControl('', [Validators.required , Validators.email]),
      password: new FormControl('', [Validators.required , Validators.minLength(4)]),
    });
  }

  onLogin(): void {
   
    }
    
  }


В нем переменная "loginForm" подсвечивается красным и выпадает такая ошибка:
"Property 'loginForm' has no initializer and is not definitely assigned in the constructor."
Подскажите что я делаю не так?? И что это вообще за ошибка?

"loginForm: FormGroup | undefined;" - решает проблему, но если создаю новые переменные, то возникает та же ошибка. Не понимаю с чем это связано(
  • Вопрос задан
  • 304 просмотра
Решения вопроса 1
@forkhammer
Fullstack-разработчик (Django, Angular)
Нужно переместить код инициализации формы в constructor()

constructor() {
    this.loginForm = new FormGroup({
      email: new FormControl('', [Validators.required , Validators.email]),
      password: new FormControl('', [Validators.required , Validators.minLength(4)]),
    });
  }


Typescript проверяет, чтобы все свойства были инициализированы в конструкторе. Чтобы отключить эту проверку надо установить strictPropertyInitialization=false в tsconfig.json
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@NarkoMan01
Попробуйте так
loginForm: FormGroup;
 constructor(
  ) { 
this.loginForm = 'some value'; // Некторое значение
}
ngOnInit(): void {
   
    this.loginForm = new FormGroup({
      email: new FormControl('', [Validators.required , Validators.email]),
      password: new FormControl('', [Validators.required , Validators.minLength(4)]),
    });
  }
Ответ написан
Альтернативно можно указать, что loginForm может быть undefined
export class LoginPageComponent implements OnInit {

   loginForm: FormGroup | undefined; // краткая запись loginForm?: FormGroup;
 
  ngOnInit(): void {
   
    this.loginForm = new FormGroup({
      email: new FormControl('', [Validators.required , Validators.email]),
      password: new FormControl('', [Validators.required , Validators.minLength(4)]),
    });
  }
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы