Tips for removing ASP.NET MVC controller name from angular route

My ASP.NET MVC login page leads to a different page that is integrated with Angular. After logging in, the URL looks something like this:

http://localhost:5083/Home#/home

I want to remove the ASP MVC controller name ("Home") from the URL. Is there a way to do this?

https://i.sstatic.net/jo9Fn.jpg

Here is the Angular Routing Configuration: https://i.sstatic.net/4UWL5.jpg

And here is the ASP.NET MVC Routing Configuration: https://i.sstatic.net/cErYz.jpg

The login page can be found at AccountContrller->Index.cshtml, and upon clicking the login button, it takes you to HomeController -->index.cshtml

Answer №1

Make sure to modify your MVC default route to direct it to the Home controller and set the action as Index. This way, when a request is made to localhost:5083, MVC will recognize the controller as Home and the action as Index. This will then trigger the AngularJS routing process.

Answer №2

When using MVC to create a website, you can set the Base Href in the Home/Index.cshtml page to /Home. This allows angular2 to route everything relative to /Home, eliminating the need to manually remove /Home from the URL. To implement this, simply add the following code snippet at the top of Index.cshtml:

<head>
<base href="/Home/"

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

JS: The for loop will keep iterating even if the condition becomes false

Can anyone help me understand why my for loop is continuing even after the conditions are met? Unfortunately I can't share the entire file due to its size, but here is a snippet of the loops: for (var j = 0; j < depKeyArr.length; j++) { var di ...

Utilizing the default event object in ag-Grid's event methods with JavaScript

I am a newcomer to ag-grid and I need help with calling event.preventDefault() in the "cellEditingStopped" grid event. Unfortunately, I am struggling to pass the default JavaScript event object into it. Is there a way to make this work? Additionally, I al ...

What is the best way to use Jquery to enclose a portion of a paragraph text within a

How can I wrap the content inside a span that comes after another span, inside a paragraph and a new span? To further illustrate this, consider the following example: <p>foo <span>bar</span> baz</p> The desired outcome is: <p& ...

"Maintaining Consistency: Ensuring The First Row is Repeated on Every

When trying to save a PDF using jspdf, I encountered an issue with tables in my HTML. The tables do not have headers, but JsPDF is automatically repeating the first row of the table on every page, causing overlap. I don't want headers on every new pag ...

I encountered issues with my Bower calls being blocked by the corporate proxy, which resulted in errors when attempting to update my

When attempting to install bower through npm for the angular seed project setup, I encountered errors due to my corporate proxy causing issues. retry Request to https://bower.herokuapp.com/packages/angular failed with ECONNRESET, retrying in 1.2s bower ...

Create a new variable and compile the sass/less file when it is requested

I'm exploring options to utilize Node.js or another server-side language to handle a specific type of request. For instance, receiving a request like this: The goal is to extract the value from the URL parameter and use it to dynamically update a var ...

The error message "Issue with three-way binding: $bindTo function is not available"

Hey, I'm working with FirebaseArray and AngularJS to sync a list when a date changes. Here's my current setup: const vm = this; vm.startDate = { startDate: moment().startOf('month'), endDate: moment().endOf('month') }; v ...

Substituting Hebrew characters for Mandaic characters within certain HTML tags can cause links to malfunction

What causes the JavaScript code provided to replace Mandaic characters with Hebrew characters on a webpage to also disable all links on the page? The code snippet is as shown below: function replaceMandaicCharacters() { const mandaicLetters = "&bsol ...

Prevent the Stop Function from being executed repeatedly while scrolling

I have implemented infinite scrolling in my react/redux app. As the user nears the bottom of the page, more contents are loaded dynamically. However, a challenge arises when the user scrolls too fast and triggers the function responsible for fetching cont ...

Running various callbacks consecutively from an array in JavaScript

I have a series of functions in an array, each one calling a callback once it's finished. For example: var queue = [ function (done) { console.log('Executing first job'); setTimeout(done, 1000); // actually an AJAX call ...

Set up the AngularJS and NodeJS server for optimal performance

Hey there! I am currently working on developing a RESTful API using Node.js and Express, while also planning to build a client-side application with AngularJS. According to the AngularJS official website: "The angular-phonecat project comes with a basic s ...

Interactive image grid with adjustable description field per image upon selection

My goal is to create a grid of images with a single text field below the grid. This text field should display the description of the image that was last clicked. The grid is implemented using floating divs within a main div, as shown in the code snippet be ...

Automatically initiate a click event when the page is loaded

I'm having trouble getting a click event to trigger on my controller when the page loads. I really just want the checkboxes to be clicked automatically. <!DOCTYPE html> <html > <head> <link rel="stylesheet" type="text/css" ...

Is there a way to stop TinyMCE from adding CDATA to <script> elements and from commenting out <style> elements?

Setting aside the concerns surrounding allowing <script> content within a Web editor, I am fully aware of them. What I am interested in is permitting <style> and <script> elements within the text content. However, every time I attempt to ...

Expo running into issues with recognizing .jsx files when using Jest

I'm encountering an issue with running jest to execute its test suite on .jsx files within my Expo project. Here is my babel.config.js: module.exports = function (api) { api.cache(true); return { presets: ['babel-preset-expo'], }; ...

Proceed with the execution of the script after a successful completion of the jQuery AJAX request

I am facing a challenge with my click function that needs to open a popup window once the ajax call is successful. I have tried different solutions like setting async: false, placing the popup in the ajax call (which got blocked by the browser), and using ...

What is the recommended library for managing a task queue in this project?

Is there a library or package available for Node.js that can help me create a task queue with a fixed timeout between the start of each task and an overall callback that is triggered after all tasks have finished? https://i.stack.imgur.com/j1wCY.jpg ...

Every time I click once, two unnecessary AJAX calls are triggered, and the DOM remains outdated until I manually refresh the page

Whenever I click on a span, it sends an ajax request to delete the clicked todo from the database. However, in the DOM, the item is not removed until I refresh the page. Here is my index.html file: <ul class="list"> </ul> I noticed ...

Is it necessary to use callbacks when using mongoose's findbyid with express to retrieve an object from the database? Are callbacks still important in modern JavaScript frameworks?

I'm currently exploring the express local library tutorial on MDN docs and wanted to try out returning an object without relying on a callback method. When I provide the request object parameter for the id to the findById mongoose method like this va ...

The closest comparison to the For In method in JavaScript in the Apex programming

I am looking for a way in Apex to iterate through all the fields of a list of account objects without having to resort to using JavaScript. Currently, I can achieve this with the following code snippet in JavaScript, but I prefer to keep things within the ...