angularjs控制器没有启动

Question

我已经配置了我的app.js，usercontroller.js，它处理来自login.html页面的所有登录请求。当单击提交按钮时，位于我的路径文件夹上的模板将被启动，但只有在用户控制器验证了详细信息之后，才会在浏览器中显示具有各种用户配置文件设置的仪表板。我的问题是单击提交按钮时模板甚至没有显示。

app.js

(function () {
    'use strict';
}());

var app = angular.module('wealthyCommunityModule', ['LocalStorageModule', 'ui.router', 'ngResource', 'datatables']);
//--Module Configuration--------------------
app.config(['$urlRouterProvider', '$stateProvider', '$locationProvider', '$httpProvider',
function ($urlRouterProvider, $stateProvider, $locationProvider,  $scope) {
    $stateProvider.
    
    state('timeline',
    {
        url: "/timeline",
        //params: { alert: { display: true, displayMessage: '' }  },
        controller: 'chatController',
        templateUrl: 'app/partials/home/home.html',
        resolve: { 
            currentUser: function (helperService, $window) {
                var user = helperService.LocalStorageUser;
                if (user == null) {
                    $window.location = '/home';
                    return;
                }
                return user;
            }


        }

    }).   
    state('login',
    {
        url: "/login",
        controller: 'userController',
        templateUrl: '/wc.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }
      
    }).
   
    state('addbank',
    {
        url: "/addbank",
        controller: 'bankController',
        templateUrl: 'app/partials/bank/addbank.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('mybanks',
    {
        url: "/mybanks",
        controller: 'bankController',
        templateUrl: 'app/partials/bank/mybanks.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('editbank',
    {
        url: "/editbank",
        params: { id:null , alert: { display: true, displayMessage: '.' } },
        controller: 'bankController',
        templateUrl: 'app/partials/bank/editbank.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('addcomplaint',
    {
        url: "/addcomplaint",
        controller: 'complaintController',
        templateUrl: 'app/partials/complaint/addcomplaint.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }
      
    }).
    state('mycomplaints',
    {
        url: "/mycomplaints",
        controller: 'complaintController',
        templateUrl: 'app/partials/complaint/mycomplaints.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('editcomplaint',
    {
        url: "/complaint",
        params: { id: null, alert: { display: true, displayMessage: '.' } },
        controller: 'complaintController',
        templateUrl: 'app/partials/complaint/editcomplaint.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('makedonation',
    {
        url: "/makedonation",
        params: { alert: { display: true, displayMessage: '' } },
        controller: 'donationController',
        templateUrl: 'app/partials/donation/makedonation.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('mydonations',
    {
        url: "/mydonations",
        controller: 'donationController',
        templateUrl: 'app/partials/donation/mydonations.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('donationactions',
    {
        url: "/donationactions",
        params: { id: null, alert: { display: true, displayMessage: '.' } },
        controller: 'splitController',
        templateUrl: 'app/partials/split/donationactions.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('donate',
    {
        url: "/donate",
        controller: 'donationController',
        templateUrl: 'app/partials/donation/donate.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }
      
    }).        
    state('split',
    {
        url: "/split",
        params: { id: null },
        controller: 'splitController',
        templateUrl: 'app/partials/split/split.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('reservation',
    {
        url: "/reservation",
        params: { id:null , alert: { display: true, displayMessage: '.' } },
        controller: 'reservationController',
        templateUrl: 'app/partials/reservation/reservation.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('cancelreservation',
    {
        url: "/cancelreservation",
        controller: 'reservationController',
        templateUrl: 'app/partials/reservation/cancelreservation.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('mytransactions',
    {
        url: "/mytransactions",
        controller: 'transactionController',
        templateUrl: 'app/partials/transactions/mytransactions.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).        
    state('infobox',
    {
        url: "/summary-info",
        controller: 'infoboxController',
        templateUrl: 'app/partials/home/infobox.html',
        resolve: { 
                currentUser: function (helperService) {                
                    return helperService.LocalStorageUser;               
                }  
            }
        //resolve: {
        //    // you can inject services in resolves, in this case you also need `$route`
        //    // to get the `itemId`
        //    //resolvedAlbum: function (albumFactory, $route) {
        //    //    return albumFactory.get($route.current.params.itemId);
        //    //}

        //    infoDetails: function (homeService, helperService, $route) {
        //        //return albumFactory.get($route.current.params.itemId);
        //        var currentUser = helperService.LocalStorageUser;
        //       return homeService.getUserTransactionSummary(currentUser.userId).then(function (results) {
        //           return results.data;
        //        });
        //    }                       
                
        //}

    }).
    state('myfollowers',
    {
        url: "/myfollowers",
        controller: 'followerController',
        templateUrl: 'app/partials/followers/myfollowers.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('chats',
    {
        url: "/chats",
        controller: 'chatController',
        templateUrl: 'app/partials/chats/chats.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('usersettings',
    {
        url: "/usersettings",
        params: { id: null, alert: { display: true, displayMessage: '.' } },
        controller: 'userController',
        templateUrl: 'app/partials/user/usersettings.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    }).
    state('signup',
    {
        url: "/signup",
        controller: 'userController',
        templateUrl: 'app/partials/account/signup.html',
        resolve: {
            currentUser: function (helperService) {
                return helperService.LocalStorageUser;
            }
        }

    });
    
    $urlRouterProvider
    .otherwise('/timeline');

    $locationProvider.
    html5Mode(false)
    .hashPrefix('!');
}]);

var wealthyCommunityHomeModuleapp = angular.module('wealthyCommunityHomeModule', [ 'LocalStorageModule', 'ui.router', 'ngResource']);
//--Module Configuration--------------------
var configs = function ($urlRouterProvider, $stateProvider, $locationProvider, $routeProvider, $scope) {
    $stateProvider
        .state('/',
        {
            url: '',          
            controller: 'publicController',
            templateUrl: 'app/partials/maincontent/home.html'
        })
        .state('/process',
        {
            url: '/process',
           
            //controller: 'publicController',
            templateUrl: 'app/partials/maincontent/process.html'


        }).state('home/faqs',
        {
            url: '/faqs',
         
            //controller: 'mainController',
            templateUrl: 'app/partials/maincontent/faqs.html'


        }).state('home/contact',
        {
            url: '/contact-us',
       
            //controller: 'mainController',
            templateUrl: 'app/partials/maincontent/contactus.html'


        }).state('signin',
        {
            url: '/signin',
            
            controller: 'authController',
            templateUrl: 'app/partials/maincontent/signin.html'


        }).state('signup',
        {
            url: '/signup',            
            controller: 'authController',
            templateUrl: 'app/partials/maincontent/signup.html'
        });


         $urlRouterProvider
        .otherwise('/');

         $locationProvider.
         html5Mode(true);
        //.hashPrefix('!');
};
wealthyCommunityHomeModuleapp.config(['$urlRouterProvider', '$stateProvider', '$locationProvider', '$routeProvider', '$httpProvider', configs])

uercontroller.js
'use strict';
app.controller('userController', ['$scope', '$location', '$stateParams', 'userService', 'localStorageService', 'helperService', 'currentUser',
    function ($scope, $location, $stateParams, userService, localStorageService, helperService, currentUser) {

    $scope.searchResults = [];
    $scope.UserDetails = {};
    var id = $stateParams.id;
    $scope.alert = $stateParams.alert === undefined ? { display: true, displayMessage: '' } : $stateParams.alert;
     

    userService.getUserbyUserId(currentUser.userId).then(function (results) {
        results.data.message = '';
        localStorageService.set('authorizationData', { token: '', userName: results.data.Username, userId: results.data.MemberId });
        $scope.UserDetails = results.data;
        $scope.UserDetails.userId = results.data.MemberId;
    }, function (error) {
        //alert(error.data.message);
    });
    
    

    $scope.getUserbyUsername = function (Username, Password) {

        userService.getUserbyUsername(Username, Password).then(function (results) {
            results.data.message = '';
            localStorageService.set('authorizationData', { token: '', userName: results.data.Username, userId: results.data.MemberId });
            $scope.UserDetails = results.data;
            $scope.UserDetails.userId = results.data.MemberId;
        }, function (error) {
            //alert(error.data.message);
        });

    };

    $scope.setUserDetails = function (userDetails) {
        localStorageService.set('authorizationData', { token: '', userName: results.data.Username, userId: results.data.MemberId });
    };


    $scope.getUserbyUserId= function () {
        userService.getUserbyUserId(id).then(function (results) {
            results.data.message = '';
            localStorageService.set('authorizationData', { token: '', userName: results.data.Username, userId: results.data.MemberId });
            $scope.UserDetails = results.data;
            $scope.UserDetails.userId = results.data.MemberId;
        }, function (error) {
            //alert(error.data.message);
        });

    };

    $scope.updateUser = function () {

        
        if (!$scope.editUserSettings.$valid) {
            return;
        }

        userService.updateUser($scope.UserDetails).then(function (results) {
            results.data.message = '';
            localStorageService.set('authorizationData', { token: '', userName: results.data.Username, userId: results.data.MemberId });
            $scope.UserDetails = results.data;
            $scope.UserDetails.userId = results.data.MemberId;

            if (results.status === 200) {
                $scope.alert = { display: false, displayMessage: 'User Details Updated successfully...' };
            }

        }, function (error) {
            //alert(error.data.message);
        });

    };

    $scope.registerUser = function () {
        userService.registerUser($scope.UserDetails).then(function (results) {
            results.data.message = '';
            localStorageService.set('authorizationData', { token: '', userName: results.data.Username, userId: results.data.MemberId });
            $scope.UserDetails = results.data;
            $scope.UserDetails.userId = results.data.MemberId;
        }, function (error) {
            //alert(error.data.message);
        });

    };

    //userService.getUserList().then(function (results) {

    //    $scope.searchResults = results.data;

    //}, function (error) {
    //    //alert(error.data.message);
    //});

    //$scope.startSearch = function() {
    //    userService.getUserList().then(function (results) {

    //        $scope.searchResults = results.data;

    //    }, function(error) {
    //        //alert(error.data.message);
    //    });
    //};

    
    //$scope.openResult = function (result) {
    //    $scope.UserDetails
    //    //  $state.go("Userdetails", { id: result.Id });
    //    $location.path("/Userdetails");
      
    //};

    
    //$scope.getUserbyId = function (id) {
    //    userService.getUserbyId(result.id).then(function (results) {
    //        results.data.message = '';
    //        $scope.UserDetails = results.data;
            
    //    }, function(error) {
    //        //alert(error.data.message);
    //    });
    //};
}]);

login.html
<form name="contactForm" class="standard-form row-fluid" action="http://www.cashexchange.co.za/login.html" method="post">
  <input type="hidden" name="_token" value="Bv7BFrcrquVqThFFTbg3YLNmbQ4HM703kdxAilu3">
  <input class="span12" name="email" placeholder="Email" type="email" ng-required="true" ng-model="UserDetails.UserName"/>
  <input class="span12" name="password" placeholder="Password" type="password" ng-required="true" ng-model="UserDetails.Password"/>
  <p class="perspective">
    <div class="checkbox">
      <label>
        <input type="checkbox" name="remember"> Remember Me
      </label>
    </div>
  </p>
  <p class="perspective">
    <div><a href="front/password/reset.html">Forgot Your Password?</a></div>
    <input type="submit" value="Login" class="btn-system normal default"/>
  </p>
</form>

Answer 1

您需要在html中声明ng-app和ng-controller，就像这样

<body ng-app="wealthyCommunityModule">
  <form ng-controller="usercontroller">......

请参阅下面的完整HTML。

＆＃13;

＆＃13;

<body ng-app="wealthyCommunityModule">
  <form ng-controller="usercontroller" name="contactForm" class="standard-form row-fluid" action="http://www.cashexchange.co.za/login.html" method="post">
    <input type="hidden" name="_token" value="Bv7BFrcrquVqThFFTbg3YLNmbQ4HM703kdxAilu3">
    <input class="span12" name="email" placeholder="Email" type="email" ng-required="true" ng-model="UserDetails.UserName" />
    <input class="span12" name="password" placeholder="Password" type="password" ng-required="true" ng-model="UserDetails.Password" />
    <p class="perspective">
      <div class="checkbox">
        <label>
          <input type="checkbox" name="remember"/>Remember Me
        </label>
      </div>
    </p>
    <p class="perspective">
      <div><a href="front/password/reset.html">Forgot Your Password?</a>
      </div>
      <input type="submit" value="Login" class="btn-system normal default" />
    </p>
  </form>
</body>

＆＃13;

＆＃13;

＆＃13;