【问题标题】：Angular Error TS2339: Property 'vehicle' does not exist on type 'Vehicle[]'角度错误 TS2339：“车辆 []”类型上不存在属性“车辆”
【发布时间】：2019-10-03 15:33:59
【问题描述】：

角度错误 TS2339：“车辆 []”类型上不存在属性“车辆”。错误出现在 data.vehicle.results 上。任何想法？是模型车辆的问题吗？我尝试在相同型号的车辆上添加车辆不起作用。

1 服务

getVehicles(): Observable<Vehicle[]> {
        return this.http.get<Vehicle[]>(CONSTANST.routes.vehicle.list);
    }

2个组件

  getVehicles() {
        this.priceruleService.getVehicles()
            .pipe(
                map(data => {
                    console.log("data :" , data.vehicle.results)
                    return data
                })
            )
            .subscribe(data => this.vehicles = data);
    }

型号

export interface Vehicle {
    _id: number
    name: string
    Type: string
    Stock: string
    vehicle: any
}

数据结构

https://imgur.com/a/sbJTbIG

【问题讨论】：

data 长什么样子？
您正在返回 Vehicle[] 数组，但在访问时使用 data.vehicle。将返回类型更改为普通对象或访问 data[index].vehicle
@Manish 对象数组
@vipulpatel 先生，您是什么意思，我好像不太清楚
@Mr.MarkTawin 那么这可能是您尝试访问对象数组上的data.vehicle.results 的问题。而是使用使用索引来访问对象。因此，如果我没记错，数据实际上是您引用的数组 data.vehicle.results

标签： javascript angular typescript

【解决方案1】：

您有不是数组的数据，但您返回的是数组类型的 observable。使其可观察，然后您可以访问：

getVehicles(): Observable<Vehicle> {
    return this.http.get<Vehicle>(CONSTANST.routes.vehicle.list);
}

【讨论】：

【解决方案2】：

请尝试更改

 getVehicles() {
        this.priceruleService.getVehicles()
            .pipe(
                map((data:Vehicle) => {
                    console.log("data :" , data.vehicle.results)
                    return data
                })
            )
            .subscribe(data => this.vehicles = data);
    }

【讨论】：

这个实现和我想访问的一样是data.vehicle.results

【解决方案3】：

如果data 是Vehicles 的数组，则只需替换

            .pipe(
                map(data => {
                    console.log("data :" , data.vehicle.results)
                    return data
                })
            )

与

            .pipe(
                tap(data => {
                    console.log("data :" , data);
                })
            )

属性vehicle 不存在于类型Vehicle[] 上（仅在类型Vehicle 上），并且这里没有一个名为results 的属性。

（是的，如果map 获取数据，对它们执行副作用，并返回相同的未更改数据，它应该是tap，而不是map）。

【讨论】：

但是数据是嵌套的，我为什么要访问 data.vehicle.results
但是data.vehicle 不存在。
不存在是什么意思？
getVehicles() 得到一个数组。它具有所有数组属性，例如 length，但没有名为 vehicle 的属性。
但是我怎样才能进入巢穴？

【解决方案4】：

好的，你添加的数据改变了很多事情，我只写另一个答案，而不是重写。（顺便说一句，如果您可以将数据放在帖子中而不是屏幕截图，那就太好了）。

第一件重要的事情：您会遇到 TypeScript 错误。换句话说，编译（或转译或构建）时错误。 TypeScript 无法知道 API 调用将来自哪些数据，只能遵循您的声明。这里：

getVehicles(): Observable<Vehicle[]> {

“获取一个可观察的车辆类型数组”。然后当您尝试访问data.vehicle - 这已经是一个TS错误，因为您声明了一个完全不同的数据结构。

实际结构看起来像

interface IVehicleItem {
/* you fill it */
}

interface IVehiclesResponse {
    vehicle: {
        results: IVehicleItem[];
    }
}

那么，你应该可以

getVehicles(): Observable<IVehiclesResponse> {
        return this.http.get<IVehiclesResponse> //...

没问题。

【讨论】：