Question

我对打字稿和角度2中的数据类型有疑问。我在typescript中创建了一个类

export class product{
    public id:number;
    public name:string;
    public status:boolean;
    constructor(){}
}

我实例化了这个类，以便在我的系统中使用。

private product:Product = new Product();

当我在打字稿中使用产品实例时，它确实属于产品类型。问题是我的后端是在php / laravel。当我在服务器中获得产品时，我的后端在json中返回一个对象。我将这个json分配给我的产品实例。

this.productService.getProductById(id).subscribe(result => {
      this.product = result;
});

但实例不再是类型产品，而恰好是类型对象。当我在分配

之前和之后给出console.log时，我意识到了这一点

this.productService.getProductById(id).subscribe(result => {
       console.log(this.product);   
       this.product = result;
       console.log(this.product); 
});

导致控制台：

Imagens {}
Object {id: 1, namme: "test", status: true…}

这是一个问题。我想使用数据输入。另一个细节是，如果我的服务器返回它在类中没有的属性，服务器响应会将属性插入到产品中。我希望我的类实例的安全性只具有在类中定义的属性。

任何人都知道如何解决这个问题？

Answer 1

勘定

this.product = result;

未在result上设置原型。如果您希望result属于Product类型，我建议您将构造函数（带有数据对象）添加到Product并调用它：

this.product = new Product(result);

对于小班，我可能只是手动编写构造函数：

public class Product {
    foo: int;
    constructor(obj) {
        this.foo = obj.foo;
    }
}

但是这需要将每个字段作为赋值重复。但它确实有效！

我个人使用自定义assign为我这样做，格式为：

constructor(obj) {
    assign(this, obj, {}, {})
}

它基本上只是执行类似的Object.assign来完成工作，还有一些额外的参数，以防我必须在产品中实例化new。

Answer 2

这就是我要做的事情：

创建一个反映您从服务器返回的内容的界面：

interface IProduct {
    id: number;
    name: string;
    status: boolean;
}

允许Product的构造函数接受：

class Product {
    public id: number;
    public name: string;
    public status: boolean;
    constructor(copyFrom?: IProduct) {
        if (copyFrom != null) {
            this.id = copyFrom.id;
            this.name = copyFrom.name;
            this.status = copyFrom.status;
        }
    }
}

当我收到json时，实例类型会发生变化

2 个答案: