未找到属性angular2和打字稿

问题描述：

我有一个api，返回给我一个json，并将响应传递给我的班，这工作正常。但是json不包含类中的一些varibales，我希望如果它没有被设置，那么这些变量会被初始化为null。但他们根本不出现（他们消失），我得到一个例外，他们不在那里，而他们应该在那里。请解释为什么会发生这种情况会非常令人满意。未找到属性angular2和打字稿

export class CustomPurchaseOrderProduct { 
    constructor(
    public productId: number, 
    public productName: string, 
    public warehouseName: string, 
    public binLocationCode: string, 
    public amountInStock: number, 
    public sellingPrice: number, 
    public productTaxRate: number, 
    public calculatedTax: number, 
    public unitPrice: number, 
    public discount: number 
) {} 
} 

    getCustomProductOrders() { 
const url = `${this.localUrl}purchaseOrderProducts`; 
return this.http.get(url) 
    .map(response => <CustomPurchaseOrderProduct[]>response.json());

}

getAllPurchaseOrderProducts() { 
this.purchaseOrderService.getCustomProductOrders() 
    .subscribe(
     response => this.customPurchaseOrderProducts = response 
    );

}从阵列

{ 
"productId": 8, 
"productName": "Akomka ", 
"warehouseName": null, 
"binLocationCode": null, 
"amountInStock": 0, 
"sellingPrice": 0, 
"productTaxRate": 10, 
"unitPrice": 0

}

console.log('This is form Object', this.customPurchaseOrderProducts[index].calculatedTax);

JSON对象所以我期待我的CalculatedTax，UnitPrice和Discount为空，但当控制台记录对象时，它们不在那里。

当我在控制台登录它们时，calculateTax和其他变量就不在对象中。

为什么不使用'elvis'运算符来建立模型。像'public calculatedTax？：number'这将使该字段可选 –

如果属性不存在，投射将不会更改该属性。铸造仅仅是让工具做出假设的工具暗示，但在运行时却没有效果。 –

@RahulSingh我不希望他们是可选的我想看到他们是空的，如果没有被设置 – user3701188

答

通过这样做：

.map(response => <CustomPurchaseOrderProduct[]>response.json());

你只是告诉编译器，你知道数据的形状和你是确保它的类相匹配。如果您通过控制台登录响应，您可以看到它是一个普通的POJO，并将控制台日志Object {...}，所以它实际上不是您班级的实例。

如果您真的希望它成为您的类的实例并具有可能不存在的属性，那么您可以在注释中提到将它们作为可选属性。如果该属性不存在，则分配空值。所以，你缩短类：

export class CustomPurchaseOrderProduct { 
    private productId: number; 
    private productName: string; 
    private calculatedTax?: number; 

    constructor(
    productId: number, 
    productName: string, 
    calculatedTax?: number 

) { 
    this.productId = productId; 
    this.productName = productName; 
    this.calculatedTax = calculatedTax || null 
    } 
}

所以上面我们都标记为calculatedTax可选的，如果它不存在响应，我们分配null的财产。请注意，您需要在构造函数中将可选属性标记为最后一个。

然后在HTTP请求您需要创建传入的数据作为您的类的实例，所以你需要做的：

getCustomProductOrders() { 
    const url = `${this.localUrl}purchaseOrderProducts`; 
    return this.http.get(url) 
    .map(response => <CustomPurchaseOrderProduct[]>response.json() 
    .map(data => 
     new CustomPurchaseOrderProduct(data.productId, data.productName, data.calculatedTax) 
    ) 
    ) 
}

使用类VS接口是一个值得商榷的问题，有些人更喜欢接口，一些类。所以你也可以使用接口，但单靠这一点并不能解决问题。解决这个问题也可以在你得到响应时完成，迭代数据并检查属性是否存在于对象中，如果不存在，则将其分配给null。但以上是解决方案是使用类:)

未找到属性angular2和打字稿

相关推荐