0

I want to redirect to another page by clicking a button, but when I click on a button, URL is changed, but it is not redirected, I have to refresh the page with new URL. The same is also happening when I click on link.

locationController.js

    angular.module('reservationModule').controller('locationController', function($scope, $location){
    $scope.setLocation = function (url) {
    $location.path(url);
};
    })

reservationModule.js

    (function () {
       var resModule = angular.module('reservationModule', ['ngRoute']); 

       resModule.controller('HomeController', function ($scope) {  // here $scope is used for share data between view and controller
   $scope.Message = "Yahoooo! we have successfully done our first part.";
       });

       resModule.config(function ($locationProvider, $routeProvider) {
   $locationProvider.html5Mode(true);
   $routeProvider
       .when('/', {
           templateUrl: '/Home/Index.cshtml',
           controller: 'locationController'
       })
       .when('/Home/Index', {
           templateUrl: '/Home/Index.cshtml',
           controller: 'locationController'
       })
       .when('/Home/Registration', {
           templateUrl: '/Home/Registration.cshtml',
           controller: 'registerController'
       })
       .when('/Home/Login', {
           templateUrl: '/Home/Login.cshtml',
           controller: 'loginController'
       })
       .otherwise({ redirectTo: '/' });
       });

     })();

Index.cshtml

    @{
//    Layout = "~/Views/Shared/_Layout.cshtml";
ViewBag.Title = "Webový rezervační systém";
    }
    <base href="/">
    <div class="container" ng-controller="locationController">
<header class="header">
    <div class="headerleft">
        <div class="headerlogo">
            <a href="/Home/Index"><img alt="reservation" src="../Content/pics/vetstoria-logo.jpg" width="50" height="50"></a>
        </div>
    </div>  
        <div class="headerright">
            <p class="headerlogintext">
                <a class="btn headerlogin" href="/Home/Login" style="text-decoration:none">Přihlašte se</a>
            </p>
        </div>

</header>

<div class="content">
    <h1 class="content-title">Webový rezervační systém</h1>
    <p class="content-title-text">V našem rezervačním systému se můžete rezervovat na cokoliv chcete. Ať už si chcete rezervovat sportoviště, nějaký kurz nebo jiné, u nás to jde snadno.</p>

    <p class="content-title-text">Pro začátek vám stačí jediné.</p>
    <button class="btn-big" ng-click="setLocation('/Home/Registration')">Registrovat</button>
</div>
       <!-- <ul class="menuUl">
            <li>@Html.ActionLink("Register", "Registration")</li>
</ul>-->


     @section Scripts{
        <script src="~/Scripts/Angular_Controllers/locationController.js"></script>
    }

I read some topics about this, but I don't know, if an error is in the module, or in the controller.

mates.lukas94
  • 45
  • 1
  • 6

1 Answers1

0

I had a similar issue. The template url should point to ".html" rather than ".cshtml". When you try to access files inside the Default Folders created by Visual Studio, for some reason you cannot access it. So try changing your path.

prajju343
  • 11
  • 4