我的 Angular 获取请求的正确语法是什么？ [复制]

Question

我试图通过在后端创建一个端点并使用 Angular Http 服务查询它来通过 ID 获取用户。

正确的语法是什么？

这是我当前的代码：

服务

voteOn(poll: Poll, userID: string, choice: number) {
  var user;
  this.http.get('/'+userID)
  .map(response => response.json())
  .subscribe(json => user = json )
        user.votes.push({poll, choice });
        const body = JSON.stringify(user);
        const headers = new Headers({'Content-Type': 'application/json'});
        const token = localStorage.getItem('token')
            ? '?token=' + localStorage.getItem('token')
            : '';
        return this.http.patch('https://voting-app-10.herokuapp.com/user'+token, body, {headers: headers})
            .map((response: Response) => response.json())
            .catch((error: Response) => {
                this.errorService.handleError(error);
                return Observable.throw(error);
            })
            .subscribe();
}

路线

router.get('/:userid', function (req, res, next) {
  var userId = req.params.userid;
  UserModel.findById(userID, function (err, user) {
    return res.send(user);
  });
});

显然这是不正确的。调用 user.votes.push 时未定义用户变量。如何正确地将第一个查询的结果分配给用户？

---

解决方案：

voted(poll: Poll, userID: string, choice: number) {
      var user;
      this.http.get('/'+userID)
      .map(response => response.json())
      .subscribe(
            json => {
              user = json;
              var result = "";
              for (var i = 0; i < user.votes.length; i ++) {
                if (user.votes[i].poll == poll.pollId) {
                  result = "disabled";
                  if (user.votes[i].choice == choice) {
                    result =  "cheked";
                  }
                }
              }
              console.log("RESULT:"+result);
              return result;
          }
      )
    }

Answer 1

这里只说 Angular2 方面（不像 Express 那样熟悉，但路由处理程序看起来不错）：

在高层次上，这看起来是合理的。你的核心问题是你在传递给 Observable.map() 的 lambda 中返回一个订阅，它将把它包装在一个 Observable: Observable 中。通常，您希望从客户端方法返回 Observable 而不是 Subscription，并让使用客户端的人决定如何订阅结果：

return this.http.patch(
                    'https://voting-app-10.herokuapp.com/user'+token, 
                    body, {headers: headers})
                .map((response: Response) => response.json())
                .catch((error: Response) => {
                    this.errorService.handleError(error);
                    return Observable.throw(error);
                })

这将返回 Observable，但如果你定义一个接口并将 response.json() 转换为它，你可以更好地输入。

为避免外部可观察包装，请考虑改用switchMap：

this.http.get('/'+userID)
    .switchMap(user => 
        user.votes.push({poll, choice });
        const body = JSON.stringify(user);
        const headers = new Headers({'Content-Type': 'application/json'});
        const token = localStorage.getItem('token')
            ? '?token=' + localStorage.getItem('token')
            : '';
        return this.http.patch('https://voting-app-10.herokuapp.com/user'+token, body, {headers: headers})
            .map((response: Response) => response.json())
            .catch((error: Response) => {
                this.errorService.handleError(error);
                return Observable.throw(error);
            });
      )

对于 Angular Http 对象的一般用法（加上样板 REST 客户端基类），请查看：https://gist.github.com/lokitoth/d71794061e7e03bb8c1bf73648d6733d