类错误地实现了接口“OnInit”。 “Component”类型中缺少属性“ngOnInit”，但“OnInit”类型中需要属性“ngOnInit”

Question

有人问了这个问题，但代码结构不完全相同。请问有什么帮助吗？

所以这里有错误类“ContactFormComponent”错误地实现了接口“OnInit”。 “ContactFormComponent”类型中缺少属性“ngOnInit”，但“OnInit”类型中需要属性“ngOnInit”

‘ngOnInit’在这里声明。

和

找不到名称“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.

}

Answer 1

看到我的错误。

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.
  }
}

Answer 2

在 OnInit() 之前添加 ng 就像你使用它时一样：

  ngOnInit(): void {
      // console.log('hi');
    }