ASP.NET WEB API AND ANGULAR 4 (USING .NET FRAMEWORK NOT .NET CORE 1 OR 2)


Is this possible to implement asp.net web api (.net framework) in angular 4?

I've followed the docs in angular.io and I've already implemented it in my machine, and it has AOT.

By the way I am using Visual Studio Enterprise 2015.

My question is how to config the startup.cs .(net framework asp.net web api) into my angular 4. 

What i always saw was implement angular 4 in asp.net core.

So I can't display the data from web api to my angular 4 project.

 


Asked by:- Aileereal
1
: 2859 At:- 10/31/2017 12:29:55 PM
ASP.NET WEB API ANGULAR 4 .NET FRAMEWORK

@Aileereal, so your question is how to config the startup.cs .(net framework asp.net web api) into my angular 4. ?? Did i got it right If yes, what is your issue exactly, can you explain again in more details about issue which you are facing 0
By : bhanu - at :- 10/31/2017 1:14:16 PM
i have index.html of my angular 4 project and it has AOT, which also has build.js. So, how can i copy it in my _Layout.cshtml. So when i run C# class controller. My angular 4 project must show instead of mvc template of asp.net. And lastly, how can my angular 4 project consume my web api? 0
By : Aileereal - at :- 11/1/2017 2:57:44 AM
These two is the missing process on my asp.net project. 1. How to display my angular 4 project(Index.html) in _Layout.cshtml with AOT. 2. What is the configuration to consume my angular 4 project the web api i created, dynamically. Without hard coding the url of the localhost. 0
By : Aileereal - at :- 11/1/2017 3:01:00 AM
By the way, my angular 4 and web api are both in single project. Not a seperate project. Happy Coding. Thanks. 0
By : Aileereal - at :- 11/1/2017 3:35:32 AM






1 Answers
profileImage Answered by:- neena

I am not angular expert but i can provide you few helpful links, after understanding your requirements

1.How to display my angular 4 project(Index.html) in _Layout.cshtml with AOT
-> Take a look at this Url you will find complete guide to set up project(although it is angular 2, but angular 2 and 4 are almost same)
https://www.codeproject.com/Articles/1181888/Angular-in-ASP-NET-MVC-Web-API-Part

2.What is the configuration to consume my angular 4 project the web api i created, dynamically.
-> You may have to configur your project's Route, as you posted above your Projects are in same solution, you need proper routing all the details are in above link, which step by step guide, i believe you need to configure route using code below for your mvc web api project

public class RouteConfig
    {
        public static void RegisterRoutes(RouteCollection routes)
        {
            routes.IgnoreRoute("{resource}.axd/{*pathInfo}")
           routes.MapRoute(
                            name: "Default",
                            url: "{*anything}",
                            defaults: new { controller = "Home", action = "Index", id = UrlParameter.Optional }
                        );
        }
    }

Other helpful links, which can help you

https://www.infragistics.com/community/blogs/dhananjay_kumar/archive/2015/06/05/a-step-by-step-guide-to-working-with-the-asp-net-web-api-and-angularjs.aspx

http://www.codemag.com/article/1705091

https://www.codeproject.com/Tips/1136450/Consume-WEBAPI-in-Angularjs

http://www.dotnetcurry.com/aspnet/1049/crud-database-aspnet-webapi-angularjs

Hope this helps, if you will look carefully on First link and Second link of this comment you will get your answers for sure

1
At:- 11/1/2017 7:42:03 AM
Thanks for helping me, but i've already tried this. It works on non-aot setup. My project is aot. I can't render the build.js in _Layout.cshtml. Failed to load resource: the server responded with a status of 404 (Not Found) build.js. 0
By : Aileereal - at :- 11/1/2017 11:25:50 AM
If you are getting this error failed to load resource (404 not found) then you are not providing proper path to Either build.js or your routing is not proper Check issues like this https://github.com/angular/angular-cli/issues/1080 0
By : neena - at :- 11/1/2017 12:02:35 PM






Login/Register to answer
Or
Register directly by posting answer/details

Full Name *

Email *




By posting your answer you agree on privacy policy & terms of use

Subscribe Now

Subscribe to our weekly Newsletter & Keep getting latest article/questions in your inbox weekly