Javascript 如何将json数据传递给Angular中的类变量？

我有一个班的作业

export class Projects {
project_id: number;
project_name: string;
category_id: number;
project_type: string;
start_date: Date;
completion_date: Date;
working_status: string;
project_info: string;
area: string;
address: string;
city: string;}

它的服务级别是

@Injectable()
export class ProjectsService {

  constructor(private http: HttpClient) {}

  //http://localhost:9090/projectInfo
private apiUrl = 'http://localhost:9090/projectInfo';

public findAll() {
  return this.http.get(this.apiUrl);
 }

 getProducts(): Observable<ProjectsModule[]> {
  return this.http.get<ProjectsModule[]>(this.apiUrl);
}

@Injectable（）
导出类项目服务{
构造函数（私有http:HttpClient）{}
//http://localhost:9090/projectInfo
私人apiUrl服务器http://localhost:9090/projectInfo';
公共财政部（）{
返回this.http.get（this.apirl）；
}
getProducts（）：可观察{
返回this.http.get（this.apirl）；
}

组件是

import { Component, OnInit } from '@angular/core';
import { ProjectsService } from '../projects.service';
import{Projects} from '../projects';
import { plainToClass, Transform, Expose, Type, Exclude } from 'class-transformer';
@Component({
  selector: 'app-project-list',
  templateUrl: './project-list.component.html',
  styleUrls: ['./project-list.component.css'],
  providers: [ProjectsService]
})
export class ProjectListComponent implements OnInit {

private projects:Projects[]=[];
stringObject: any;
  constructor(
   private projectsService: ProjectsService) { }
   vandana='rahul';
   
  ngOnInit() {
   this.getAllProjects();
   }


 getAllProjects() {
   this.projectsService.getProducts().subscribe((data: Projects[])=> {
      this.stringObject =JSON.stringify(data)
      let newTodo = Object.assign(new Projects(), data); 
      this.projects=  <Projects[]>this.stringObject;
      console.log("data  -"+ this.projects)
      console.log("Array  -"+ this.stringObject)
      console.log("data  -"+ this.projects[1].project_info)
      },
      
   err => {
   console.log(err);
   } 
   
  );
 
   }

从'@angular/core'导入{Component，OnInit}；
从“../projects.service”导入{ProjectsService}；
从“../Projects”导入{Projects}；
从“类转换器”导入{plainToClass，Transform，Expose，Type，Exclude}；
@组成部分({
选择器：“应用程序项目列表”，
templateUrl:'./project list.component.html'，
样式URL:['./项目列表.component.css']，
提供者：[项目服务]
})
导出类ProjectListComponent实现OnInit{
私人项目：项目[]=[]；
stringObject:任何；
建造师(
私有项目服务：项目服务{}
万达那='rahul'；
恩戈尼尼特（）{
这是.getAllProjects（）；
}
getAllProjects（）{
this.projectsService.getProducts（）.subscribe（（数据：Projects[]）=>{
this.stringObject=JSON.stringify（数据）
让newTodo=Object.assign（newprojects（），data）；
this.projects=this.stringObject；
log（“数据-”+this.projects）
log（“数组-”+this.stringObject）
console.log（“数据-”+this.projects[1]。项目信息）
},
错误=>{
控制台日志（err）；
} 
);
}

当我试图读取newTodo.project_id（或类Projects的任何属性）时，它是未定义的 但纽托多正在返回杰森达塔

输出为

---

请帮助我获取newtodo.project\u id、newtodo.project\u name等值

您正在将JSON字符串分配给

this.projects

JSON字符串是

[{“projectId”：1，…}]

因此：

• this.projects[1]

  计算结果为

  {

  （即字符串中的第二个字符）

• “{.project_id

  的计算结果为

  未定义

您应该将数据本身分配给此。项目：

this.projects = data;

请记住JavaScript中的数组是基于零的。由于数组中只有一个对象，因此必须按如下方式打印

projectId

：

console.log(this.projects[0].projectId);

---

另外，

Projects

类的属性与JSON完全不匹配。此外，

Projects

可能应该命名为

Project

，并且应该是一个接口而不是一个类。

您正在为

this.Projects

指定一个字符串值。为什么？试图以某种方式将数据解析到Projects类，并尝试任何可能的方式都已完成更改..它正在赋值..未定义已完成更改..它正在赋值..未定义您的类定义（应该是一个接口）与您的JSON不匹配。若要在html文件中读取它，我可以使用值为{{project.projectId}