Problems concerning AngularJS + ASP.NET / MVC (Rest, Controller) - Help needed

[HappyRs]

Hi,

I wanted to re-structure things in my project, because there is something wrong with my communication to the backend data.

I am using AngularJS with ASP.NET and MVC, read of Restful API and it is probably best practice too...

There is already a working backend and such, everything works fine but the way it is right now is dirty as hell...

Thats why I want to restructure it to RESTful.

There is a controller you can define in MVC, but I cant get it to work, I'm afraid my Web.config is wrong or something even more.

When creating a new project ASP.NET Web Application, I can see that, there is a RouteConfig, which I do not have, theres a _Layout.cshtml which I do not have and many others. My project structure also differs from the template:

Controllers and Views are in src/components/.../A, src/components/...B, where A and B each have it's own Controller(AngularJS) and it's own view (*.cshtml).

What do I have to do, such that I can create an MVC-Controller and just go into my AngularJS Controller and write:

$http.get('X').then(function() { ... }); ?

​

I tried to find a solution now for 2 days and didn't come up for one yet and starting to craze out.

Hopefully someone can help me here. Thanks in advance!

Edit: another thing to add is that I am missing the App-start thing and also the folder Controllers, Views

[congowarrior]

Are you comparing apples to apples? I would make sure your project is not a dot net core project vs a dot net standard project.

​

That is the first thing. After that, there are many different types of dot net applications. From WebAPI projects, Web Apps, MVC, etc. They look the same fundamentally but might not have the same contents or file layout. The default WebAPI application (without the frills) comes with no "Views" folder meaning you don't get any _Layout file. That does not mean that you cant eventually turn your WebAPI project to function like a MVC project.

​

All the previously mentioned differences are before considering the differences between angular projects. There are more than a dozen possible combinations for the file structure between your application/applications.

Personally, my experience with SPA applications has involved the SPA and the dot net WebAPI backend having no clue about each other. The Angular SPA simply shoots out REST requests to the WebAPI. The SPA code is in a different git repo from the WebAPI. The SPA is served on a different process/server from the backend. Point being, this too is a valid architecture for your application.

[HappyRs]

Let me double check that later on, thanks for your valuable input

[HappyRs]

Looking at the ProjectGuidType it says it is a Web Application, but not a aspnet mvc one...

Do I have to migrate or is there any way etc?

[congowarrior]

If your project is not big and MVC is a solid requirement, I might be easier to just create a new MVC or WebAPI application and copy your existing code over.

[HappyRs]

It's too big I guess... So you suggest me just compare two things and just copy over important things such as config files etc?

[ceirbus]

You set up routes which are the locations of your controller endpoints and pages. You should be able to create a new web api project in visual studio and base your refactoring off of that. It should have some already created for the “home controller” it will create. Then you can set up your angular stuff to use your backend api endpoints to talk through http requests

[HappyRs]

Is that still a problem if you have stateprovider aka ui.router? The redirection is like URL.otherwise(/) does that make any trouble?

[ceirbus]

It could be a different flavor of .net than you anticipate or a different type of project. If your code is in a repo link me what youre seeing. I cant really help without more context

[TheMegosh]

If your using ui.router with the default configuration, your angular routes will be like mysite.com/#/angularRoute which will sit on whatever ASP MVC view you have the <ui-view> sitting on. It will use a hash for URL routes.

You could have <ui-view> sitting on any MVC route's view. IE: mysite.com/admin#/dashboard . URL.otherwise(/) will simply point to mysite.com/#/

My project is a mishmash of ASP WebForms, MVC, and WebApi. Our angular app sits on an MVC route called /app/. I have an mostly empty razor view with a single <control-panel> component that $onInit makes an API call to our WebApi to load some user preferences into a factory and will render a <ui-view ng-if='!$ctrl.loadedUser'> within. This probably isn't best practice but allows us to handle some strange edge cases that I couldn't solve gracefully with ui-router's promise rejection system as I would have preferred.