0

I have a button in which i have registered a click event . Now as per my requirement i want my current page to route to next page using Angular JS routing .I am trying to add routing code in my click event but its not happening. Here is my Angular JS code..

 var app = angular.module('LoginApp', ['ngRoute']);
 app.config(function ($routeProvider) {
 app.controller('LoginformController', function ($scope) {

        $scope.LoginCheck=function () {

         alert("Trying to login !");

        }
 });

Now after alert i want this page to navigate to 'Home.html'.Please help me how to route to 'Home.html' after alert message.Thanks

I am trying to add below code but the page is not navigating ..

app.config(function ($routeProvider) {

app.controller('LoginformController', function ($scope,$location) {

    $scope.LoginCheck=function () {

    alert("Trying to login !");

    $location.path('/Home.html');

}

$scope.PasswordRecovery = function () {
    alert("Clicked 2");
}
});
});
Lara
  • 2,821
  • 7
  • 39
  • 72
  • using state provider is probably better than using route provider, check out [this](http://stackoverflow.com/questions/27645202/what-is-the-difference-between-routeprovider-and-stateprovider-in-angularjs) – Joe Lloyd Sep 02 '15 at 10:44
  • @JoeLloyd Will you please see my updated code that i have posted ..What is the mistake in that ..Please let me know – Lara Sep 02 '15 at 10:48
  • possibly need the `#` so change this line `$location.path('#/Home.html');` – Joe Lloyd Sep 02 '15 at 10:49
  • @JoeLloyd Tried but not working.I am getting an error as Error: [ng:areq] http://errors.angularjs.org/1.3.9/ng/areq?p0=LoginformController&p1=not%20a%20fu‌​nction%2C%20got%20undefined in the console` – Lara Sep 02 '15 at 10:51
  • what error is it throwing? – Joe Lloyd Sep 02 '15 at 10:52
  • @JoeLloyd .i am getting an error as Error: [ng:areq] http://errors.angularjs.org/1.3.9/ng/areq?p0=LoginformController&p1=not%20a%20fu‌​nction%2C%20got%20undefined in the console – Lara Sep 02 '15 at 10:53
  • are you using angularjs min? when you get the script? – Joe Lloyd Sep 02 '15 at 10:55
  • @JoeLloyd Yes i ma using Angular Js min – Lara Sep 02 '15 at 10:56
  • Can you provide your route table plus the complete error message you are getting? – skubski Sep 02 '15 at 10:57
  • switch to the full version for debugging. min wont give you readable errors. so first off change that. then rerun the code and see the real error. off to lunch now good luck – Joe Lloyd Sep 02 '15 at 10:58

2 Answers2

3

try this

var app = angular.module('LoginApp', ['ngRoute']);
 app.config(function ($routeProvider) {
 app.controller('LoginformController', ['$scope', '$location', function ($scope, $location) {

        $scope.LoginCheck=function () {

         alert("Trying to login !");
         $location.path('path where to redirect');
        }
 }]);

$location.path is getter and setter both It will get when without parameter ie $location.path(); And it will set when with parameter ie $location.path('path to redirect')

intekhab
  • 1,566
  • 1
  • 13
  • 19
  • Getting and error as `ReferenceError: $location is not defined` on adding ` $location.path('/Home.html');` – Lara Sep 02 '15 at 10:39
  • 1
    obviously put `$location` as a service in your function – Joe Lloyd Sep 02 '15 at 10:42
  • I have updated my post with my tried code as per your suggestion nut its not working ..Please have a look .. – Lara Sep 02 '15 at 10:46
  • 1
    Remove slash before Home.html write as $location.path('Home.html'); – intekhab Sep 02 '15 at 10:49
  • @intekhab Removed still its not working ..i am getting an error as `Error: [ng:areq] http://errors.angularjs.org/1.3.9/ng/areq?p0=LoginformController&p1=not%20a%20function%2C%20got%20undefined` in the console – Lara Sep 02 '15 at 10:52
  • 1
    Are you using htm5Mode(true) ? – intekhab Sep 02 '15 at 10:52
  • Well in that case write $location.path('/urlWhereToRedirect'); where urlWhereToRedirect is http://domain.com/urlWhereToRedirect The whole url after domain name – intekhab Sep 02 '15 at 10:55
  • I added `file:///D:/ron%201%20Sept%202015/ron%201%20Sept%202015/Login%20&%20Registration%20Form/Home.html` This is my full URL still the page is not navigating..By the way How to give the relative path from my project directory ? Here `Home.html` is present in the same project directory – Lara Sep 02 '15 at 11:01
  • Is home.html a file and you want to make it read by angular ? – intekhab Sep 02 '15 at 11:04
  • Can you provide your route table plus the complete error message you are getting? Your route configuration is crucial, as long as you don't share it, people will just keep on guessing what the correct parameter in path() is. Don't know why this answer got +2 for just guessing. – skubski Sep 02 '15 at 11:05
  • Definitely there is something missing in config just leave the $location.path('/home.htm') as it is and add in config $routeProvider.when('/home.html', {templateUrl:'urlOfTemplate', controller:'controllername'}); and please have a look on it https://docs.angularjs.org/guide/$location – intekhab Sep 02 '15 at 11:09
0

Try this:

var app = angular.module('LoginApp', ['ngRoute']);

app.config(['$routeProvider',function ($routeProvider) {

   $routeProvider


        .when('/Login', {
            templateUrl: 'LoginView.html',
            controller: 'LoginController'
        })
}])

app.controller('LoginformController', function($scope,$location) {

  $scope.LoginCheck = function(){
     alert("Trying to login !");
     $location.path('/Login');
  }
});
Rafael K
  • 16
  • 3