Блог

Кто-то задал этот вопрос, но не совсем ту же структуру кода. Итак, какая-нибудь помощь в этом, пожалуйста?

Итак, вот класс ошибок «ContactFormComponent» неправильно реализует интерфейс «OnInit». Свойство ‘ngOnInit’ отсутствует в типе ‘ContactFormComponent’, но требуется в типе ‘OnInit’

Здесь объявлено «нгОнИнит».

и

Не удается найти имя «ngOnInit»

 import { Component, Injectable, OnInit } from '@angular/core';
import { FormBuilder} from '@angular/forms';
import { Validators} from '@angular/forms';
import { HttpClient } from '@angular/common/http';
import { HttpErrorResponse } from '@angular/common/http';
import 'validator';



@Component({
  selector: 'app-contact-form',
  templateUrl: './contact-form.component.html',
  styleUrls: ['./contact-form.component.scss'],
})

export class ContactFormComponent implements OnInit {

      
  checkoutForm = this.fb.group ({
    firstName :  ['', Validators.required, {updateOn: 'blur'}],
    lastName :  ['', Validators.required, {updateOn: 'blur'}],
    email :  ['', Validators.required, {updateOn: 'blur'}],
    password :  ['', Validators.required, {updateOn: 'blur'}],
    address : this.fb.group ({
      state :  ['', Validators.required, {updateOn: 'blur'}],
      country :  ['', Validators.required, {updateOn: 'blur'}],
      city :  ['', Validators.required, {updateOn: 'blur'}],
      zip :  ['', Validators.required, Validators.minLength(6), Validators.maxLength(6), {updateOn: 'blur'}],
    })
  });




  constructor(private fb: FormBuilder, private httpService: HttpClient) { }

  get form()
  {
      return this.checkoutForm.controls;
  }

  get firstName(){
    return this.checkoutForm.get('firstName');

  }
  get lastName(){
    return this.checkoutForm.get('lastName')
  }
  get email(){
    return this.checkoutForm.get('email')
  }
  get password(){
    return this.checkoutForm.get('password')
  }
  get state(){
    return this.checkoutForm.get('state')
  }
  get country(){
    return this.checkoutForm.get('country')
  }
  get street(){
    return this.checkoutForm.get('street')
  }
  get zip(){
    return this.checkoutForm.get('zip')
  }


  onSubmit(){
    console.warn(this.checkoutForm.value)
  }

}


ngOnInit() {
  //Called after the constructor, initializing input properties, and the first call to ngOnChanges.
  //Add 'implements OnInit' to the class.

}
 

Увидел свою ошибку.

 ngOnInit() {
//Called after the constructor, initializing input properties, and the first call to ngOnChanges.
  //Add 'implements OnInit' to the class.
}
 

Приведенный выше код должен был быть в приведенном ниже коде

 export class ContactFormComponent implements OnInit { }
 

например

 export class ContactFormComponent implements OnInit {
  ngOnInit() {
  //Called after the constructor, initializing input properties, and the first call to ngOnChanges.
  //Add 'implements OnInit' to the class.
  }
}