需要澄清Angular中的map和observable语法

时间:2018-02-02 16:20:41

标签: javascript angular typescript observable

有一种令我困惑的语法,我用map函数和typescript / Angular(Angular 5)中的observable看到它。我有两种方法:

这个是一个组成部分:

logout() {
   this.authService.logout().subscribe( 
       result => {
           this.router.navigate(['/login']);
       }
   );
}

这是相关服务:

logout(): Observable<any> {
    return this.http.post('/api/auth/logout', { }).map( 
        response => { 
            this._token = null;
            //more unrelated code...
            return true 
        }
    );
}

在这两种情况下令我困惑的部分是:

thing => {
    //code
}
这是什么?上面的代码有效。但我发现事情既有“结果”又有“回应”。 “东西”可以是任何东西,还是在某处定义?

另外,我在w3schools的javascript中查找了map函数(因为我从未使用它)并且在示例中显示第一个参数应该是一个应用于每个元素的函数它所关联的数组但是“thing =&gt; {}”不是一个函数,所以这是非常令人困惑的。

请注意,我的问题在于解决潜在的误解,而不是关注我的具体问题,但解决我的具体问题可能有助于说明我的误解。

上面代码的问题是,当它工作时,它不知道当api端点返回500错误时该怎么做。我正在尝试确定如何捕获错误,以便我可以在前端执行某些操作。

1 个答案:

答案 0 :(得分:1)

你可以将它命名为任何东西。结果,数据,响应等无所谓。您基本上要做的是为订阅发出的结果创建一个变量。订阅接受函数(),在该函数内部,您传递要用于成功结果的变量名称。实际上,在这里,使用结果毫无意义,因为没有任何事情可以用它完成。如果您不打算对响应做任何事情,最好只说:

logout() {
    this.authService.logout().subscribe(() => {
        this.router.navigate(['/login']);
    });
}

要捕获错误,您只需要在最后一次卷曲后传递逗号,如下所示:

logout() {
    this.authService.logout().subscribe(() => {
        this.router.navigate(['/login']);
    }, err => {
        // Do something with error here
    });
}

至于地图,这是一个例子

var array1 = [1, 4, 9, 16];
const map1 = array1.map(x => x * 2);

它基本上接受数组中的每个变量并执行该map方法,这意味着它接受每个值并执行函数所做的任何操作,在这种情况下,将其乘以2.将其视为一种转换。在该示例中,它基本上用于在将响应发送回订阅之前操纵响应。