angular - 将值分配到导入的数据模型中

Question

我创建了一个这样的模型：

export class User {
  firstName: string;
  lastName: string;
  email: string;
  faculty: string;
  academicYear: number;
  participatingEvents: Array<string>;
  myClubs: Array<{id: string, isPresident: boolean, isEventPlanner: boolean}>;
}

并在组件中使用此模型将数据上传到 firebase

export class TestComponent implements OnInit {

   message: string;
   user1: User;

   ngOnInit() {
      this.user1.firstName = 'PRIYASHAN';
      this.user1.lastName = 'JAYASANKHA';
      this.user1.email = '[e-mail]';
      this.user1.faculty = 'UCSC';
      this.user1.academicYear = 1;
      this.user1.participatingEvents = ['ABC', 'DEF'];
      this.user1.myClubs = [
         {id: 'QQQ', isEventPlanner: true , isPresident: true},
         {id: 'WWW', isEventPlanner: false , isPresident: true}
      ];

      this.af.submitData(this.user1);
    }
}

但它不工作我的控制台显示

标签： angulartypescriptmodel

Answer 1

您会收到此错误，因为user1在您尝试对其设置值之前未定义。在尝试访问它之前初始化对象。

user1: User;

ngOnInit() {
   this.user1 = new User();
   // ... rest of the code
}

此外，您应该创建一个构造函数来在创建异议期间初始化所有这些属性。这样代码变得更短，并避免了开发过程中的印刷错误。

通过这些更改，您的代码将如下所示：

export class User {
  constructor(
    public firstName: string,
    public lastName: string,
    public email: string,
    public faculty: string,
    public academicYear: number,
    public participatingEvents: Array<string>,
    public myClubs: Array<{
      id: string;
      isPresident: boolean;
      isEventPlanner: boolean;
    }>
  ) {}
}

创建对象 + 初始化其属性

  ngOnInit() {
    this.user1 = new User(
      "PRIYASHAN",
      "JAYASANKHA",
      "[e-mail]",
      "UCSC",
      1,
      ["ABC", "DEF"],
      [
        { id: "QQQ", isEventPlanner: true, isPresident: true },
        { id: "WWW", isEventPlanner: false, isPresident: true }
      ]
    );
  }