Question

我正忙于编写服务以将数据返回到我的角度应用程序（ng4）中的组件。数据是从智能合约中检索的。

我似乎收到以下错误：

HomeComponent_Host.html:1 ERROR TypeError: this.smartContractService.getDrawId(...).subscribe is not a function

我的组件代码：

    this.smartContractService.getDrawId().subscribe(data => {
        console.log('Result:: ', data);
    });

我的服务方法：

getDrawId(): Observable<any> {
    let gameObject;
    return this.Game
        .deployed()
        .then(instance => {
            gameObject = instance;
            return gameObject.getDrawId.call();
        })
        .then(value => {
            return value; //console.log(value) returns the data.
        })
        .catch(error => {
            console.error('Error getting draw id; see log.');
            console.log(error);
        });
}

我不确定如何从服务和调用组件中获取数据......

Answer 1

你似乎试图将承诺和观察结合起来。 Promise和observables有一些相似之处，因为它们都是为了处理异步事件。但是，虽然承诺只处理1个最终值，但Observables处理的是0，1或许多值的流。

显然，this.Game.deployed（）正在返回一个promise，因为你正在调用.then（这是你与promises交互的方式）。但是，getDrawId声明返回Observable<any>，而您正在调用.subscribe;一个只存在于可观察数据上的函数，而不是承诺。

所以前进的道路取决于你的意图。由于this.game.deployed返回一个promise，也许你想在整个过程中使用promises，在这种情况下你可以这样做：

getDrawId(): Promise<any> { //<--- type changed
    let gameObject;
    return this.Game
        .deployed()
        .then(instance => {
            gameObject = instance;
            return gameObject.getDrawId.call();
        })
        .then(value => {
            return value; //console.log(value) returns the data.
        })
        .catch(error => {
            console.error('Error getting draw id; see log.');
            console.log(error);
        });
}

// And use it with .then instead of .subscribe
this.smartContractService.getDrawId().then(data => {
    console.log('Result:: ', data);
});

或者，也许你想让getDrawId返回一个observable，在这种情况下你可以做一个更大的重构，你可以在其中使用this.Game.deployed（）使用observables，这样你就可以使用它们了;或者你可以保留原样并围绕承诺创建一个观察点：

getDrawId(): Observable<any> {
    let gameObject;
    return Observable.fromPromise(this.Game
        .deployed()
        .then(instance => {
            gameObject = instance;
            return gameObject.getDrawId.call();
        })
        .then(value => {
            return value; //console.log(value) returns the data.
        })
        .catch(error => {
            console.error('Error getting draw id; see log.');
            console.log(error);
        });
    );
}

此外，当我离开代码中的<any>时，如果您知道，我建议您使用更具体的类型。

将数据从服务返回到Angular

1 个答案: