Question

我尝试在HTTP请求之后返回一个承诺，但是当我在我的组件上打印返回时，我得到了未定义。

服务：

getPlace() {
let promise = new Promise((resolve, reject) => {

  this.http.get('http://localhost:3000/api/place/')
      .toPromise()
      .then(
          res => { // Success
            this.results = res.results.map(item => {
              var place = new Place();
              place.place_id = item.place_id;
              place.name=item.name;
              place.vicinity=item.vicinity;
              place.coordinates = new Coordinates();
              place.coordinates.latitude = item.geometry.location.lat;
              place.coordinates.longitude = item.geometry.location.lng;
              return place;
            });

            resolve();
            console.log(  this.results);
          },
          msg => { // Error
            reject(msg);
          }
      );
});
return promise;
}

这是我的组件调用：

getPlace(): void{
 this.cityService.getPlace().then( (res) => {console.log(res);
   });
}

Answer 1

.then()中的参数函数将作为参数获取，无论您传递给resolve()。

因此，当您执行resolve('stuff')时，最终.then(r => console.log(r))会打印'stuff'。

您收到undefined因为现在正在调用您的resolve而没有参数：

      res => { // Success
        this.results = res.results.map(item => {
          var place = new Place();
          place.place_id = item.place_id;
          place.name=item.name;
          place.vicinity=item.vicinity;
          place.coordinates = new Coordinates();
          place.coordinates.latitude = item.geometry.location.lat;
          place.coordinates.longitude = item.geometry.location.lng;
          return place;
        });

        resolve();                              // <==== resolve without arguments here
        console.log(  this.results);
      },

由于您希望.then()获得results，请将其添加到resolve。上面的代码应该是：

      res => { // Success
        this.results = res.results.map(item => {
          var place = new Place();
          place.place_id = item.place_id;
          place.name=item.name;
          place.vicinity=item.vicinity;
          place.coordinates = new Coordinates();
          place.coordinates.latitude = item.geometry.location.lat;
          place.coordinates.longitude = item.geometry.location.lng;
          return place;
        });

        resolve(this.results);                  // <===== changed this line
        console.log(  this.results);
      },

Answer 2

您正在返回undefined，因为您没有使用Promise解析。

this.http.get('http://localhost:3000/api/place/')
      .toPromise()
      .then(
          res => { // Success
            this.results = res.results.map(item => {
              var place = new Place();
              place.place_id = item.place_id;
              place.name=item.name;
              place.vicinity=item.vicinity;
              place.coordinates = new Coordinates();
              place.coordinates.latitude = item.geometry.location.lat;
              place.coordinates.longitude = item.geometry.location.lng;
              //return place; Remove this
            });

        resolve(this.results);
        console.log(  this.results);
      },
      msg => { // Error
        reject(msg);
      }
  );

Answer 3

在正确使用Promise时，我遇到了同样的问题，显然是由于HTTP拦截器，我不得不处理一些错误状态代码。

我正在使用

return next.handle(request).pipe(
    catchError((err: any) => {
        // ...

        return of(err);
    })
);

更改为

return next.handle(request).pipe(
    catchError((err: any) => {
        // ...

        return throwError(err);
    })
);

Angular 5 Promise返回undefined

3 个答案: