Question

这就是我想要做的事。

@Component({
   selector: "data",
   template: "<h1>{{ getData() }}</h1>"
})

export class DataComponent{
    this.http.get(path).subscribe({
       res => return res;
    })
}

如果在getData内调用DataComponent，您可以建议将其分配给this.data = res这样的变量，并使用我喜欢{{data}}。但我需要使用{{getData}} {1}}出于我自己的目的。请建议我吗？

Answer 1

您无法直接返回该值，因为它是异步调用。异步调用意味着它在后台运行（实际安排在以后执行），同时代码继续执行。

您也无法直接在课堂上使用此类代码。需要将其移动到方法或构造函数中。

您可以做的不是直接subscribe()，而是使用像map()这样的运算符

export class DataComponent{
    someMethod() {
      return this.http.get(path).map(res => {
        return res.json();
      });
    }
}

此外，您可以将多个.map与相同的Observable组合在一起，因为这有时可以提高代码清晰度并使事物保持分离。例如：

validateResponse = (response) => validate(response);

parseJson = (json) => JSON.parse(json);

fetchUnits() {
    return this.http.get(requestUrl).map(this.validateResponse).map(this.parseJson);
}

这样一个observable将返回调用者可以订阅

export class DataComponent{
    someMethod() {
      return this.http.get(path).map(res => {
        return res.json();
      });
    }

    otherMethod() {
      this.someMethod().subscribe(data => this.data = data);
    }
}

来电者也可以在另一个班级。这只是为了简洁。

data => this.data = data

和

res => return res.json()

是箭头功能。它们与普通功能类似。当数据从响应到达时，这些函数将传递给subscribe(...)或map(...)以从observable调用。这就是为什么无法直接返回数据的原因，因为当someMethod()完成时，数据尚未收到。

Answer 2

我知道的两种方式：

export class SomeComponent implements OnInit
{
    public localVar:any;

    ngOnInit(){
        this.http.get(Path).map(res => res.json()).subscribe(res => this.localVar = res);
    }
}

一旦返回信息，就像在promise中一样，这会将结果分配给局部变量。然后你只需{{ localVar }}

另一种方法是将一个observable作为localVariable。

export class SomeComponent
{
    public localVar:any;

    constructor()
    {
        this.localVar = this.http.get(path).map(res => res.json());
    }
}

通过这种方式，您可以在html中公开可观察的观察点，即使用AsyncPipe {{ localVar | async }}

请尝试一下，让我知道它是否有效。此外，由于角度2很新，如果出现问题，请随时发表评论。

希望有所帮助

Answer 3

如何将这个存储在一个可以在订阅之外使用的变量中？

this.bindPlusService.getJSONCurrentRequestData(submission).map(data => {
    return delete JSON.parse(data)['$id'];
});

Answer 4

我用这种方式很多时间......

＆＃13;

@Component({
   selector: "data",
   template: "<h1>{{ getData() }}</h1>"
})

export class DataComponent{
    this.http.get(path).subscribe({
       DataComponent.setSubscribeData(res);
    })
}


static subscribeData:any;
static setSubscribeData(data):any{
    DataComponent.subscribeData=data;
    return data;
}

＆＃13;

使用静态关键字并节省您的时间......在这里您可以使用静态变量或直接返回您想要的对象....希望它能帮助您...快乐编码......

angular 2如何从订阅返回数据

4 个答案: