angular - 为什么构造函数不更新类变量？

问题描述

在我的角色组件上，以下行运行良好：

  public ngOnInit(): void {
    this.rolesFromSugar = this.sugarService.getRolesFromSugar();
  }

我的服务看起来像这样

  public getRolesFromSugar(): Role[] {
    this.getData("roles")
    .subscribe((roles) => {
      roles.data.forEach((role) => {
        this.roleList.push(new Role(role));
      });
    });

    return this.roleList;
  }

  private getData(item: string): Observable<any> {
    return this.http.get<any>(this.endPoint + `${item}`);
  }

我的角色如下所示：

import { Model } from "./model";

export class Role extends Model {
  public type: string = "users";
  public id: string;
  public name: string;
  public description: string;

  constructor(data?: any) {
    super(data);
  }
}

export abstract class Model {

  public constructor(data?: any) {
    const self = this;

    if (undefined !== data && null !== data) {
      for (const prop in data) {
        if ("attributes" !== prop) {
          if (typeof data[prop] !== "function") {
            self[prop] = data[prop];
          }
        }
      }

      if (undefined !== data.attributes && null !== data.attributes) {
        for (const prop in data.attributes) {
          if (typeof data.attributes[prop] !== "function") {
            self[prop] = data.attributes[prop];
          }
        }
      }
    }
  }

}

这没有问题，我可以看到我的组件上的所有内容。

但是当涉及到 User 模型时，道具不会更新：


  public ngOnInit(): void {
    this.usersFromSugar = this.sugarService.getUsersFromSugar();
  }

  public getUsersFromSugar(): User[] {
    this.getData("users")
    .subscribe((users) => {
      users.data.forEach((user) => {
        this.userList.push(new User(user));
      });
      console.log("USERLIST", this.userList);
    });

    return this.userList;
  }


import { Model } from "./model";

export class User extends Model {
  public type: string = null;
  public id: string = null;
  public userName: string = null;
  public salutation: string = "Mrs.";
  public lastName: string = null;
  public firstName: string = null;
  public phoneHome: string = null;
  public phoneMobile: string = null;
  public phoneWork: string = null;
  public phoneOther: string = null;
  public phoneFax: string = null;
  public phoneAsterisk: string = null;
  public email: string = null;
  public status: string = "Active";
  public employeeStatus: string = "Active";
  public title: string = null;
  public managerId: string = null;
  public department: string = null;
  public officeId: string = null;
  public teamId: string = null;
  public tourplanID: string = null;
  public swClickToCall: boolean = false;
  public swCallNotification: boolean = false;
  public codeSonGalileo: string = null;

  public swPhoneNumber: string = null;
  public swExtension: string = null;
  public swTelephony: boolean = false;
  public inheritsPreferencesFrom: string = "user_default";
  public roleId: string = null;
  public serviceId: string = null;
  public functionId: string = null;
  public destinations: string[] = [];
  public ggOrganisationId: string = null;
  public ggGroups: string = null;
  public isAdmin: number = 0;
  public apiPortalUser: number = 0;
  public assignationNotification: number = 0;
  public userGroup: number = 0;
  public defaultTeams: number = 1;
  public leadsMin: number = 15;
  public leadsMax: number = 45;

  public constructor(data?: any) {

    super(data);
    console.log("data passed to super, ", data);
  }
}

当我使用 console.log(self[prop]) 时，我明白了。但随后变量只是不更新并保持其默认值。我们在 Docker 中运行 Angular 4

出于所有意图和目的，这就是数据的样子：

{
"data": [
{
"type": "users",
"id": "4ab50c2e-fce7-8385-2e9f-5c2e85737c1a",
"attributes": {
"id": "4ab50c2e-fce7-8385-2e9f-5c2e85737c1a",
"userName": "asdasdsad",
"salutation": "",
"lastName": "asdasdsadsad",
"firstName": "asdasdsad",
"phoneHome": null,
"phoneMobile": null,
"phoneWork": "0123456789",
"phoneOther": null,
"phoneFax": null,
"phoneAsterisk": "2083",
"email": null,
"status": "Active",
"employeeStatus": "Active",
"title": null,
"managerId": "",
"department": "Ventes",
"officeId": "1009",
"teamId": "",
"tourplanID": "asdasd",
"swClickToCall": "1",
"swCallNotification": "1",
"codeSonGalileo": ""
}
},
{
"type": "users",
"id": "asdasdasdsadsad",
"attributes": {
"id": "asdsadsadsa",
"userName": "asdsadasd",
"salutation": "Mr.",
"lastName": "asdsa asdsad",
"firstName": "asdsad",
"phoneHome": null,
"phoneMobile": null,
"phoneWork": "018888888",
"phoneOther": null,
"phoneFax": null,
"phoneAsterisk": "2272",
"email": null,
"status": "Active",
"employeeStatus": "Active",
"title": null,
"managerId": "8aba3fff-7c33-f4ea-283d-57d1e94e6627",
"department": "Ventes",
"officeId": "1009",
"teamId": "Iroquois",
"tourplanID": "asdasd",
"swClickToCall": "1",
"swCallNotification": "1",
"codeSonGalileo": ""
}
},

如果构造函数可以像更新角色模型变量一样更新用户模型，那么我的组件可以显示从 API 获取的数据。非常感谢您。

编辑：我试过这个，我仍然有相同的结果：

  public getUserPromiseFromSugar(): Promise<User[]> {
    return this.getData("users")
    .map((users) => users.data)
    .toPromise();
  }

  public getUsersFromSugar(): User[] {
    this.getUserPromiseFromSugar()
    .then((users) => users.forEach((user) => this.userList.push(new User(user))))
    .then((data) => console.log("promise over", this.userList));

    setInterval(() => console.log("this userlist", this.userList), 1000);

    return this.userList;
  }

标签： angularconstructormodel

angular - 为什么构造函数不更新类变量？

问题描述

解决方案

推荐阅读