【问题标题】:How to redirect a page to another using AngularJS in ExpressJS如何在 ExpressJS 中使用 AngularJS 将页面重定向到另一个页面
【发布时间】:2017-01-30 10:15:05
【问题描述】:

这是登录页面

        <!DOCTYPE html>
        <html ng-app="myApp">
        <head>
        <!--<script src="controllers/logincontroller"></script> -->     

        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

        <!-- Optional theme -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

            <title>Login Page</title>
        </head>
        <body>

        <div class="container" ng-controller="loginctrl">
        <h1>Login Page</h1>
        <label>UserName</label><input class="form-control" ng-model="user.name"><br><br>
        <label>Password</label><input class="form-control" ng-model="user.password"><br><br>
        <button class="btn btn-primary" ng-click="login()" >Login</button>
        </div>

        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
        <script src="controllers/logincontroller.js"></script>
        <script src="angularjs/angular.js"></script>
        <script src="angular-route/angular-route.js"></script>
        </body>
        </html>                 

   This is Controller page

        var myapp = angular.module('myApp', ['ngRoute']);

        myapp.config(["$routeProvider", function($routeProvider) {
            $routeProvider
            .when('/', {
                controller: 'loginctrl',
                templateUrl: 'login.html'
            })
            .when('/addusers', {
                controller: 'addusersctrl',
                templateUrl: 'addusers.html'
            })
            .otherwise({
                redirectTo: '/'
            });            
        }]);

        myapp.controller('loginctrl',['$scope', '$route', '$routeParams', '$location',function($scope,$http,$location){
            console.log("im a controller");            

            $scope.login = function() {
                //console.log($scope.user);

                // $http.post('/login',$scope.user).success(function(response){
                //  console.log(response);
                // });

                $http({
                      method: 'post',
                      url: '/login',
                      data: $scope.user 
                    }).then(function successCallback(response) {
                        // this callback will be called asynchronously
                        // when the response is available

                        console.log(response.data);
                        //$window.location.href = 'addusers.html';
                         $location.path("/addusers");
                    }, function errorCallback(response) {

                        console.log(response.data);
                        // called asynchronously if an error occurs
                        // or server returns response with an error status.
                    });            
            };
        }]);            

        myapp.controller('addusersctrl',['$scope','$http',function($scope,$http){
            console.log("im a controller");           

            $scope.login = function() {
                //console.log($scope.user);

                // $http.post('/login',$scope.user).success(function(response){
                //  console.log(response);
                // });

                $http({
                      method: 'post',
                      url: '/login',
                      data: $scope.user 
                    }).then(function successCallback(response) {
                        // this callback will be called asynchronously
                        // when the response is available

                        console.log(response.data);
                        //$window.location.href = 'addusers.html';

                    }, function errorCallback(response) {

                        console.log(response.data);
                        // called asynchronously if an error occurs
                        // or server returns response with an error status.
                    });            
            };
        }]);

每当我尝试运行此代码时,我都会得到

Angular.js 错误 angular.js:38 未捕获的错误:[$injector:modulerr]http://errors.angularjs.org/1.6.1/$injector/modulerr?p0=myApp&p1=Error%3A%2…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.6.1%2Fangular.min。 js%3A21%3A332)

【问题讨论】:

    标签: javascript angularjs redirect


    【解决方案1】:

    dependency injection(第一个控制器)有问题:

    myapp.controller('loginctrl', ['$scope', '$route', '$routeParams', '$location', 
                     function($scope, $http, $location) {
    

    你没有注入同样的东西。将其更改为:

    myapp.controller('loginctrl', ['$scope', '$route', '$http', '$routeParams', '$location', 
                     function($scope, $route, $http, $routeParams, $location) {
    

    【讨论】:

      猜你喜欢
      • 2015-03-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-06-16
      • 1970-01-01
      • 2023-02-02
      • 2013-08-17
      相关资源
      最近更新 更多