时间戳

首页 > 解决方案 > 类型 'Observable' 不可分配给类型 'any[]'。“可观察”类型中缺少属性“长度”

arrays - 类型 'Observable' 不可分配给类型 'any[]'。“可观察”类型中缺少属性“长度”

问题描述

在我的 Angular 应用程序中，我通过异步调用获取了一些数据。然后，一旦我有了这些数据，我就有了一个函数（见下文），它遍历该数组并获取传入的相应 stageName 的 record_id。然而，我遇到了一个 ts 错误——stageRecords 下有一个红色波浪线（见下面的星号），错误是：

[ts] 类型 'Observable' 不可分配给类型 'any[]'。
“可观察”类型中缺少属性“长度”。

这是我的代码：

public async getStageIdByName(stageName)
{
    let stageRecords = [];
    **stageRecords** = await this.getAllStages();
    if (stageName && stageRecords) {
        console.log('stageRecords: ', stageRecords);
        for (let record of stageRecords) {
            if (record.stage === stageName) {
                let stageId = record._id;
                console.log(`stageId for ${stageName} is ${stageId}`);
                return stageId;
            }
        }
    }
}

我需要改变什么来解决这个问题？我尝试使用Array.from()，但这并不能解决这是一个可观察的问题，这显然使这一举动变得不可能。如何解决从响应中获取数组的问题this.getAllStages()？

更新：根据我的建议，我导入了 toPromise() 运算符，然后将我的代码更改为如下所示：

public async getStageIdByName(stageName)
{
    let stageRecords = [];
    stageRecords = await this.getAllStages().toPromise();
    if (stageName && stageRecords) {
        console.log('stageRecords: ', stageRecords);
        for (let record of stageRecords) {
            if (record.stage === stageName) {
                let stageId = record._id;
                console.log(`stageId for ${stageName} is ${stageId}`);
                return stageId;
            }
        }
    }
}

这似乎是正确的轨道，但是，我现在收到此错误：

Type 'Response' is not assignable to type 'any[]'.
  Property 'length' is missing in type 'Response'.

顺便说一句，我的 getAllStages() 函数如下所示：

public getAllStages()
{
    let stageRecords;
    let recordsArray;
    let fn = response => {
        stageRecords = response.data;
        if (stageRecords) {
            recordsArray = Array.from(stageRecords);

            return recordsArray;
        }
    };

    return this.stageService.getStages((fn));
}

标签： arraysangulartypescriptangular2-observables

解决方案

你的getAllStages回报Observable，而不是承诺，所以你不能等待它。

您要么通过toPromise()方法将其作为承诺，要么订阅它。

如果您使用 rxjs 6 (angular 6) 并且后面是 http 请求，这应该可以工作，在旧版本中，您需要导入该toPromise运算符。

stageRecords = await this.getAllStages().toPromise();

在旧版本的 Angular 中，您需要像这样导入该运算符

import 'rxjs/add/operator/toPromise';

推荐阅读