在angular中使用object属性识别JSON中的对象ID

Question

我正在做一个简单的图书管理应用程序。当用户点击"添加到收藏夹时，那本书将被添加到收藏夹页面。到目前为止，我已经建立了开始页面，登录页面和注册页面。我使用JSON作为数据库(书籍)。json和users.json)，并使用json -server来托管数据。这里我的问题是，当新用户创建时，如何自动创建空的愿望列表?基于Mail id，如何获取那个对象的id ?我在YouTube和文档中尝试了一些方法。但我失败了

user.json

[
{
"id": 1,
"userName":"Deepak Sharma",
"Password":"dep@123!",
"Phone":"9988776655",
"Email":"[e-mail]",
"UserType":"Customer",
"WishList": [1,2,3],
"Completed":[4,5,6]
},
{
"username": "test1",
"Password": "test1",
"Phone": 123456,
"Email": "[e-mail]",
"id": 2
}
]

login-page.component.ts

import { HttpClient } from '@angular/common/http';
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';

@Component({
selector: 'app-login-page',
templateUrl: './login-page.component.html',
styleUrls: ['./login-page.component.css']
})
export class LoginPageComponent implements OnInit {
public loginForm!: FormGroup;
constructor(private formBuilder : FormBuilder, private http: HttpClient, private router: Router) { }
ngOnInit(): void {
this.loginForm = this.formBuilder.group({
Email: ['', Validators.required],
Password: ['', Validators.required]
})
}
login(){
this.http.get<any>("http://localhost:3500/Users")
.subscribe(res=>{
const user = res.find((a:any) =>{
return a.email === this.loginForm.value.email && a.password === this.loginForm.value.password
});
if (user) {
alert("Login Success!");
this.loginForm.reset();
this.router.navigate(['user'])
} else {
alert("User Not found. Create account !!");
}
}, err=>{
alert("Something Went Wrong");
})
}
}

下面是favorite-page.component.ts 的代码

import { Component, OnInit, ViewChild } from '@angular/core';
import { LoginPageComponent } from '../login-page/login-page.component';
@Component({
selector: 'app-favourite-page',
templateUrl: './favourite-page.component.html',
styleUrls: ['./favourite-page.component.css']
})
export class FavouritePageComponent implements OnInit {

constructor() { }
ngOnInit(): void {
}

}

Answer 1

您可以在创建新用户的函数中创建一个您喜欢的格式的愿望列表。格式可以是JSON、临时数组或插入数据库。

我还可以看到您正在使用已弃用的订阅调用方法。考虑查看教程&Angular、rxjs和ngrx.