Блог

Привет, я сейчас изучаю Angular. Я создаю одно простое веб-приложение, используя Angular и Spring Boot. Я хочу присвоить одну переменную переменной-члену класса.

 import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';


export class UserCred{
  constructor (
    public username: string,
    public password: string
  ){}
}

@Injectable({
  providedIn: 'root'
})
export class UserRegistrationService {

  public userCred : UserCred


  constructor(
    private http: HttpClient
  ) { }
 
    public createUser(user){
      return this.http.post("http://localhost:8080/restapi/users",user);
    }

    public postUserCredientials(username, password){
      console.log("Service login");
      this.userCred.username = username;
      this.userCred.password = password;
      console.log("class username : ",this.userCred.username);
      return this.http.post("http://localhost:8080/restapi/login", this.userCred);
    }

  

Когда я пытаюсь присвоить это значение, оно не принимается.
this.userCred.username = имя пользователя;
this.userCred.password = пароль;

имя пользователя и пароль, которые я пытаюсь назначить, поступают из другого компонента. Я получил эти значения, используя [(ngModel)] из Html-файла

 Error


ERROR TypeError: Cannot set property 'username' of undefined
    at UserRegistrationService.postUserCredientials (user-registration.service.ts:30)
    at LoginComponent.handleLogin (login.component.ts:39)
    at LoginComponent_Template_button_click_8_listener (login.component.html:8)
    at executeListenerWithErrorHandling (core.js:15216)
    at wrapListenerIn_markDirtyAndPreventDefault (core.js:15251)
    at HTMLButtonElement.<anonymous> (platform-browser.js:582)
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:27476)
    at ZoneDelegate.invokeTask (zone-evergreen.js:398)
    at Zone.runTask (zone-evergreen.js:167)
  

Ошибка возникает из-за того, что вам нужно инициализировать переменную, которая была объявлена только в данном коде.

попробуйте

 export class UserRegistrationService {
  public userCred : IUserCred = {
     username: '',
     password: ''
   }
  

Кроме того, создайте interface класс, а не класс, если вы просто хотите определить тип

 export interface IUserCred{  // try to add "I" to UserCred , it's a convention to know whether it's an interface or class.
 username: string;
 password: string;
}