浏览表单AngularJS

时间:2016-07-13 22:20:43

标签: javascript angularjs forms

我有两种不同的HTML表单

  1. 的index.html
  2. home.html的
  3. 我正在尝试在index.html中创建一个登录,如果它已经过身份验证,我想导航到home.html,如果不是我正在显示警告消息。但该页面无法导航。关于我做错了什么的想法?

    我的代码如下

    的index.html

    <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>
    

1 个答案:

答案 0 :(得分:-1)

尝试:

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

而不是

$location.path("/home" );