IIS Virtual directory creates path problem

See more:

IIS8

MVC5

I am using VS 2013 and MVC5
To host the application in IIS, i have used Properties-> Web ->Servers ->Local IIS and clicked on Create Virtual directory.
So this created a VD for "MyPortal"

But now i have a path problem.

I have an api controller in my application.
When i was using VS development server it was being accessed using the url : http://localhost:1553/api/menuapi and the data was getting accessed correctly.

But once it is hosted to IIS, it stopped working.
When checked, it is trying to fetch the data from url i.e :
http://localhost/api/menuapi and it gives a 404 error.

But actually the api is fine and the data is accessible from the url :
http://localhost/MyPortal/api/menuapi

Why and how is this path problem created?
The below is how i am doing the api call :
1. In javascript file :

$http.get('/api/menuapi/' + menuid).success(function (data) {});

Please suggest if any alternatives.