swsnu / swppfall2017

22 stars 17 forks source link

How do I connect to the mock backend? #42

Open cloudytheconqueror opened 6 years ago

cloudytheconqueror commented 6 years ago

After setting up the router, I tried to visit localhost:4200/api/user/1, but it causes a router error and shows nothing. Also, sending a GET request to that URL with the service doesn't yield anything useful.

I tried to fix this by disabling the router (and made app.component.html include the sign-in page directly) for testing purposes, and visited the above URL again, but it doesn't give the user information and just shows the sign-in page again.

What should I do to connect to the mock backend?

wonook commented 6 years ago

There has been a slight difference in the method of accessing the data using the mock-backend and the python Django backend that we have used during our practice session. I would suggest using the method like the snippet below to get articles:

  private articlesUrl = '/api/articles/';  // URL to web api

  getArticles(): Promise<Article[]> {
    return this.http.get(this.articlesUrl)
      .toPromise()
      .then(response => response.json().data as Article[])
      .catch(this.handleError);
  }

Notice the .dataafter response.json(). My tip is to use the console.log() function whenever you encounter similar problems and to see what objects are getting returned. Sorry for the inconvenience caused by not using a proper backend. It had to be limited since we haven't dealt with backends yet.

cloudytheconqueror commented 6 years ago

Doing that didn't do any help. Also, displaying the result of the service via console.log shows this:

Object { __zone_symbol__state: null, __zone_symbol__value: Array[0] }

This object doesn't seem to contain any useful information. What should I do?

wonook commented 6 years ago

Please try further and if you still have trouble and if you think something is wrong, contact me and set up an appointment during my office hour. I found no problem while doing it myself.

ghost commented 6 years ago

I got exactly the same problem, both with my work and a clean copy of the skeleton code and it's very problematic because I can't get anything working in my app because of this.

wonook commented 6 years ago

Will you try sharing your code via github and send me an email once your changes have been pushed or find me during my office hours? I tried several times and it showed no problem for me, so I can't really diagnose your problem with the information you have provided me here.

ghost commented 6 years ago

I pushed my latest changes and send you an email.

wonook commented 6 years ago

It should work if you use the same code we have used during our practice sessions, only that it should use

      .toPromise()
      .then(res => res.json().data as ...

instead of

      .toPromise()
      .then(res => res.json() as ...