0

I used the following tutorial

https://www.c-sharpcorner.com/article/asp-net-core-web-api-with-dapper-and-vs-2017/

to create a asp.net core 2 web api. The api is working fine from browser when i run

https://localhost;44313/api/liveconsole

I used the following tutorial to create the Angular UI for my web api, after several attempts I finally got the page to show something

https://www.youtube.com/watch?v=SxU04gx2EqA

I initially encountered Access-Control-Allow-Origin error but fixed by visiting this link (user answer from Ji Ra)

https://stackoverflow.com/questions/44379560/how-to-enable-cors-in-asp-net-core-webapi

My page now shows but has the default text 'liveconsole-list-works!' and nothing else. I have inspected the page and no errors. What am i doing wrong.

I have checked to see if there is a request and a response has been sent and i see the following

Api response

My angular app console has no errors and nothing on the network tab either.

I have just noticed that in the youtube the intellisense pops up when the instructor types *ngFor (@ 7mins 20secs) however on my project i do not get the intellisense. What am i missing?

Abe
  • 1,879
  • 2
  • 24
  • 39
  • Go to your browser and launch developer tools (press F12) and then swtich to network tab. Now reload your webpage and check the network call to your api `localhost:44313` and then click on the api call to see if any data is returned with 200 status code. Also, check for any console errror(s) when you launch developer tools and reload the page – Mohsin Mehmood Sep 28 '18 at 16:31
  • @MohsinMehmood Thanks for your comment, i have updated my question now. Any thoughts? – Abe Oct 01 '18 at 08:55
  • what you are expected to see ? Have you written any code to get data from api and display it on UI ? Also it seems like the Json you are returning is not a valid one – Arunprasanth K V Oct 01 '18 at 08:57
  • @ArunprasanthKV Thanks for your comment. I will report back shortly – Abe Oct 01 '18 at 09:00
  • without seeing your Json we cannot identify that, can u put the json here – Arunprasanth K V Oct 01 '18 at 09:02
  • @ArunprasanthKV I have sorted my json and i still see no results in my Angular Application. Any thoughts? It is not to do with json it is on the Angular part of the application. – Abe Oct 01 '18 at 09:17
  • where is your json ? Can you post it here , the json and the code which is using to display the josn in to the UI – Arunprasanth K V Oct 01 '18 at 09:18
  • @ArunprasanthKV - My Json is nothing complicated, here you go [{ "jobAddressID": 2, "job": 1 }, { "jobAddressID": 3, "job": 2 } ] – Abe Oct 01 '18 at 09:22
  • ok no issues with josn , so if you are not getting anything in the UI then the issue resided in your AngularCode , make sure you are getting the correct output from the service by checking your network window in browser – Arunprasanth K V Oct 01 '18 at 09:25

1 Answers1

0

Stupid as it may sound. The error was in my Angular Code. I was doing (@7mins 28secs in the video)

{{liveconsolelist.Job}} instead of {{liveconsolelist.job}}.

Once i changed this everything is working as expected.

Thanks for your comment especially the one identifying the syntax error in my Json.

Abe
  • 1,879
  • 2
  • 24
  • 39