2016-07-13 5 views
0

ich zwei verschiedene HTML-Formulare habendurch AngularJS Formen Navigation

  1. index.html
  2. home.html

Ich versuche, ein Login in index.html zu erstellen und wenn es authentifiziert Ich möchte nach Home.html navigieren und wenn es nicht ich eine Warnmeldung anzeigen. Aber die Seite navigiert nicht. Irgendwelche Ideen, was ich falsch mache?

Mein Code ist wie

index.html folgt

<body> 

<div ng-app="myApp" ng-controller="myCtrl"> 
<div ng-view></div> 
<form ng-submit="login(username, password)"> 
     <label>User name</label> 
     <input type="text" ng-model="username" class="ng-pristine ng-valid"> 
     <label>Password</label> 
     <input type="password" ng-model="password" class="ng-pristine ng-valid"> 
     <br/> 

     <br/><br/> 
     <button class="btn btn-success" ng-click="">Submit</button> 
     <button class="btn btn-warning" ng-click="cancel()">Cancel</button> 
</form> 

</div> 
<script> 
var app = angular.module('myApp', ['ngRoute']); 
app.config([ '$routeProvider', '$locationProvider', 
    function($routeProvider, $locationProvider) { 
     $routeProvider.when('/home', { 
      templateUrl : 'home.html', 
      controller : 'HomeController' 
     }). 
     $routeProvider.when('/', { 
      templateUrl : 'index.html', 
      controller : 'myCtrl' 
     }). 
     otherwise({ 
       redirectTo: 'home.html' 
      }); 
     //$locationProvider.html5Mode(true); //Remove the '#' from URL. 
    } 
]); 

app.controller('myCtrl', function($scope,$location) { 
    // $scope.count = ''; 
    $scope.login = function(username, password) { 
     if (username == 'admin' && password == '1234') 
     { 
     $location.path("/home"); 
     } 
     else 
     { 
     alert('invalid username and password'); 
     } 
    } 
}); 
</script> 

</body> 

home.html

<!DOCTYPE html> 
<html> 
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<body> 

<div ng-app="myApp" ng-controller="HomeConroller"> 

<button ng-click="myFunction()">Click Me!</button> 

<p>{{ count }}</p> 

</div> 
<script> 
var app = angular.module('myApp', []); 
app.controller('HomeConroller', function($scope) { 
    $scope.count = 0; 
    $scope.myFunction = function() { 
     $scope.count++; 
    } 
}); 
</script> 

</body> 
</html> 
+0

Versuch '$ state.go ("/ home");'. Stellen Sie sicher, dass Sie '$ state' in den Controller – theblindprophet

+0

immer noch die gleiche injizieren !! –

+0

@theblindprophet gibt es keinen '$ state' in ngRoute – charlietfl

Antwort

-1

Versuchen:

window.location.href = "home.html"; 

Statt

$location.path("/home"); 
+0

Immer noch keinen Nutzen !!! Infact, wenn ich mich nicht authentifiziere, zeigt es auch nicht den Alarm an !! Irgendwelche Gedanken ?? –

+0

Noch keine Änderung. –

+0

'home.html' ist eine Vorlage. Dies ist nicht wie angular Routing funktioniert – charlietfl

Verwandte Themen