Doe*_*ter 7 typescript angular
我有一个对象,我在多个服务中使用它,每个服务都应该接受一些参数,所以我创建了两个构造函数,但 TypeScript 不允许我这样做,我的例子是:
class User {
id: number;
username: string;
password: string;
email: string;
firstName: string;
lastName: string;
roles: string[];
constructor(username: string, password: string){
this.username = username;
this.password = password;
}
constructor(id: number, username: string, firstname: string, lastname: string, roles: string[]){
this.id = id;
this.username= username;
this.firstname= firstname;
this.lastname= lastname;
this.roles = roles;
}
//.. and maybe another constructor also
}
Run Code Online (Sandbox Code Playgroud)
请问有什么技巧可以解决这个问题吗?
例如,当我?
在构造函数中使用 Optional时:
constructor(
public id?: number,
public username?: string,
public email?: string,
public password?: string,
public firstName?: string,
public lastName?: string,
public roles?: string[]) {
}
Run Code Online (Sandbox Code Playgroud)
当我从后端获取数据时:
this.service.usersList().subscribe(users => {
console.log(users);
this.dataSource.data = users;
});
Run Code Online (Sandbox Code Playgroud)
将roles
在设置的密码,而不是在角色失败:
{
"id": 1,
"username": "user1",
"email": "user1@email.com",
"password": [
"USER",
"MODR"
]
}
Run Code Online (Sandbox Code Playgroud)
为此,我不确定这个技巧。
也许我不精确,但我使用这种方法来解析我的数据:
static fromJson(item: Object): any {
return new User(
item['id'],
item['username'],
item['email'],
item['roles']
);
}
Run Code Online (Sandbox Code Playgroud)
为此,当我创建一个可选的构造函数时,它将按照我的调用顺序设置属性。
你不能使用多个构造函数,但你可以添加一些可选参数,并验证它是否存在,就像这样:
class User {
id: number;
username: string;
password: string;
email: string;
firstName: string;
lastName: string;
roles: string[];
// The "?" says that its optional parameter
constructor(id?: number, username?: string, firstname?: string,
lastname?: string, roles?: string[], password?: string) {
if (id) { // if id exists , you can implement the first constructor
this.id = id;
this.username = username;
this.firstname = firstname;
this.lastname = lastname;
this.roles = roles;
}
if (password) { // if password exists : you can implement the second one
this.username = username;
this.password = password;
}
}
}
Run Code Online (Sandbox Code Playgroud)
在此正常工作之前,您的回复应该是这样的:
static fromJson(item: Object): any {
return new User({
id : item['id'],
username : item['username'],
email : item['email'],
roles : item['roles']
});
}
Run Code Online (Sandbox Code Playgroud)
所以你的构造函数应该是这样的:
constructor(user: any){
if (user.id) { // if id exists , you can implement the first constructor
this.id = user.id;
this.username = user.username;
this.firstname = user.firstname;
this.lastname = user.lastname;
this.roles = user.roles;
}
if (user.password) { // if password exists : you can implement the second one
this.username = user.username;
this.password = user.password;
}
}
Run Code Online (Sandbox Code Playgroud)
或者,如果您不想这样做,您可以设置有关订单的响应,如下所示:
static fromJson(item: Object): any {
return new User(
item['id'],
item['username'],
undefined,
item['email'],
undefined,
undefined,
item['roles']
);
}
Run Code Online (Sandbox Code Playgroud)