Issue
I am creating an Angular.JS page inside of an ASP.NET MVC5 C# application, and I would like to remove the # and trailing path from the URL on a new page load or browser page refresh.
For example: www.example.com/calculator#/step2
I would like it to go back to simply www.example.com/calculator
on a page refresh.
The idea is that I need it to start them back at the beginning of the calculator form on a new page load or a browser page refresh. The reason being is that the form I created does not persist the data between page refreshes, so they would need to refill in the data from the beginning.
Whenever the page is reloaded, it does call my ASP.NET calculator controller, so my idea is that the server could reset the URL path?
Inside of my ASP.NET calculator controller, I've got:
public class CalculatorController : Controller
{
// GET: Calculator
public ActionResult Index()
{
// check for # sign and remove it and trailing path from URL.
// or simply make the path "/calculator" every time.
return View();
}
}
Is there an easy way to do this? I am new to Angular.JS so if there is an Angular.JS solution to this problem I would love to hear that as well.
Solution
Using the advice of the helpful comments posted, I've written a solution to my question. Like davcs86 said, the string after the hash can only be handled client-side.
Using Angular.JS and resolve
like charlietfl suggested, this is what I came up with:
var myApp = angular.module("app-calculator", ["calculatorControls", "ngRoute"])
.config(function ($routeProvider) {
$routeProvider.when("/", {
controller: "termsController",
controllerAs: "vm",
templateUrl: "/content/templates/termsView.html"
});
$routeProvider.when("/condition", {
controller: "conditionController",
controllerAs: "vm",
templateUrl: "/content/templates/conditionView.html",
resolve: {
validate: function ($location, Data) {
if (!Data.terms) {
$location.path('/');
}
}
}
});
$routeProvider.otherwise({ redirectTo: "/" });
});
Basically, I use the resolve: { validate: ... }
section to check if my Data.terms
field has been completed. If the value has not been set (in the case of a browser page refresh which resets the data), then it will send redirect back to the root page using $location.path('/');
. Otherwise if the Data.terms has been set, then it will load the page requested.
Answered By - Daniel Congrove
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.