GET-запрос работает на сервере с почтальоном, но возвращает ноль в веб-интерфейс - PullRequest
Новая
       18

GET-запрос работает на сервере с почтальоном, но возвращает ноль в веб-интерфейс

0 голосов
/ 27 октября 2019

У меня есть запрос GET, в котором, если я добавлю создателя к сообщению в качестве параметра типа api / наблюдения /? Creator = 5dac9d3567aca81e40bfc0 и протестирую его в Postman, результаты вернут все сообщения этого создателя со следующим кодом.

app.js 

  app.get('/api/watchlist',(req, res, next)=>{
  Watching.find({ creator: req.query.creator})
  .then(documents => {
    console.log("Creator value: " + req.query.creator);
   res.status(200).json({
     message: 'User\'s watchlist items retrieved!',
     posts: documents

  });

   });
   });

Если я попытаюсь перетащить запрос GET в угловой, то он ничего не вернет. Кроме того, внешний интерфейс, когда я открываю соответствующую веб-страницу, говорит, что веб-интерфейс говорит ERROR TypeError: "retrievedData.posts is undefined" getWatchListItems watch-list.service.ts:72

watch-list.service.ts

getWatchListItems (creator: string) {

this.http
  .get<{ message: string; posts: any; maxPosts: number; watchlist: string }>(
    "http://localhost:3000/api/watchlist?creator=" + creator
  )
  .pipe(
    map(retrievedData  => {
      console.log(retrievedData.watchlist);
               return {
        posts: retrievedData.posts.map(post => {
      console.log(retrievedData.watchlist);
          return {
        title: post.title,
        cost: post.cost,
        listingOwner: post.listingOwner,
        id: post._id
          };

        }),
        maxPosts: retrievedData .maxPosts
      };
    })
  )
  .subscribe(transformedPostData => {
    console.log(transformedPostData);
    this.posts = transformedPostData.posts;
    this.postsUpdated.next({
      listing: [...this.posts],
      postCount: transformedPostData.maxPosts
    });
  });

}

Watch.component.ts 

 ngOnInit() {
    this.userId = localStorage.getItem("userId: ");
    //  this.userId = this.authService.getUserId();
    this.watchListService.getWatchListItems(this.userId);
    this.postsSub = this.watchListService
      .getPostUpdateListener()
      .subscribe((postData: { listing: Watching[]; postCount: number }) => {

        this.totalPosts = postData.postCount;
        this.posts = postData.listing;

      });

  }

1 Ответ

1 голос
/ 27 октября 2019

Вы отправляете создание в качестве параметра маршрута в сервисе angular.

Поэтому вам нужно изменить свой API следующим образом: 

app.get('/api/watchlist/:creater', (req, res, next) => {
  Watching.find({ creator: req.params.creator })
    .then(documents => {
      console.log("Creator value: ", req.params.creator);
      res.status(200).json({
        message: 'User\'s watchlist items retrieved!',
        watchlist: documents
      });
    });
});

И если вы не хотите изменять APIВы должны отправить создателя в качестве параметра запроса следующим образом: 

return this.http
      .get<{ message: string; posts: any; maxPosts: number }>(
        "http://localhost:3000/api/watchlist?creator=" + creator
      )

После этого вы должны обработать данные ответа в угловом формате и выполнить преобразование в соответствии с вашими потребностями.

Можете ли вы обновитьвопрос, включая этот результат console.log с этим кодом? (как я знаю в сервисе, вам не нужно подписываться, вы подписываетесь в своем компоненте) 

getWatchListItems(creator: string) {

  return this.http("http://localhost:3000/api/watchlist?creator=" + creator)
    .pipe(
      map(retrievedData => {
        console.log("retrievedData: ", retrievedData);
        //todo: transform retrievedData

        return retrievedData;
      })
    )
}

Не забудьте, что ваш API возвращает данные в этом формате, поэтому вам следует 

{
  "watchlist": ...
   "message": ...
}
...