控制器沒有在angularjs中調用

我正在使用angular js應用程序。我無法通過點擊按鈕提交來在我的應用程序中調用我的控制器。請檢查下面的示例代碼：控制器沒有在angularjs中調用

的index.html

<!DOCTYPE html> 
<html lang="en" ng-app="adminsuite"> 
<head> 
    <meta charset ="utf-8"> 
    <title></title> 
</head> 
<body> 
<script src="bundle.js" charset="utf-8"></script> 
<div class="container"> 
    <div ui-view></div> 
</div> 


</body> 
</html>

的login.html

<div class="col-md-6 col-md-offset-3"> 
<h2>Login</h2> 
<form name="form" ng-submit='login()' role="form"> 
    <div class="form-group" ng-class="{ 'has-error': form.username.$dirty && form.username.$error.required }"> 
     <label for="username">Username</label> 
     <input type="text" name="username" id="username" class="form-control" ng-model="username" required /> 
     <span ng-show="form.username.$dirty && form.username.$error.required" class="help-block">Username is required</span> 
    </div> 
    <div class="form-group" ng-class="{ 'has-error': form.password.$dirty && form.password.$error.required }"> 
     <label for="password">Password</label> 
     <input type="password" name="password" id="password" class="form-control" ng-model="password" required /> 
     <span ng-show="form.password.$dirty && form.password.$error.required" class="help-block">Password is required</span> 
    </div> 
    <div class="form-actions"> 
     <button type="button" ng-disabled="form.$invalid" class="btn btn-primary">Login</button> 
    </div> 
</form>

index.js

window.onpopstate = function (e) { window.history.forward(1); } 
require('jquery/dist/jquery.js'); 
require('bootstrap/dist/css/bootstrap.css'); 
require('./content/common.css'); 
require('angular'); 
require('angular-ui-router/release/angular-ui-router.js'); 
require('angular-route/angular-route.js'); 
require('angular-cookies/angular-cookies.js'); 
angular.module('adminsuite', ['ui.router','ngCookies']).config(function($stateProvider, $urlRouterProvider) { 

$urlRouterProvider.otherwise('/'); 
$stateProvider 
    .state('login', { 
     url: '/', 
     templateUrl: 'Login/login.html', 
     controller: 'loginController' 
    }) 
    // HOME STATES AND NESTED VIEWS ======================================== 
    .state('dashboard', { 
     url: '/dashboard', 
     templateUrl: 'views/dashboard.html', 
    }); 

    // ABOUT PAGE AND MULTIPLE NAMED VIEWS ================================= 

}); 
require('./Login/loginController.js'); 

require('./services/loginAuthenticationService.js'); 
require('./services/UserServices.js');

loginController.js

angular 
    .module('adminsuite') 
    .controller('loginController', ['$location', '$rootScope', 'AuthenticationService', '$scope', '$state', function($location, AuthenticationService, $scope, $state) { 
    $scope.login = function(){ 
     $scope.dataLoading = true; 
     AuthenticationService.Login($scope.username, $scope.password, function (response) { 
      if (response.success) { 
       AuthenticationService.SetCredentials($scope.username, $scope.password); 
       console.log('Login successful'); 
       //$rootScope.state = true; 
       $state.go('dashboard'); 
      } else { 
       console.log(response.message); 
       $scope.dataLoading = false; 
       //$rootScope.state = false; 
      } 
     }); 
    }; 
}

]）;

我沒有在瀏覽器的控制檯部分或命令提示符中收到任何錯誤。

來源

2016-08-02 Kishan

你在哪裏路由到登錄頁面？ –

你的'登錄'按鈕應該有'type ='submit''而不是'type ='button'' – Fissio

你的代碼看起來不錯。但是你應該從你的html中刪除type =「button」，因爲Button的默認屬性是submit。對於調試，你可以創建一個小提琴 –

你沒有在html部分指定你的控制器試試這個：

<!DOCTYPE html> 
<html lang="en" ng-app="adminsuite"> 
<head> 
    <meta charset ="utf-8"> 
    <title></title> 
</head> 
<body ng-controller="loginController"> 
<script src="bundle.js" charset="utf-8"></script> 
<div class="container"> 
    <div ui-view></div> 
</div> 


</body> 
</html>

來源

2016-08-02 09:12:37

他在ui-router配置文件中定義了它，所以不需要ng-controller –

'ui-router'正在處理那個 – Fissio

他在login.js文件上調用了控制器....所以這不是必需的 –

編輯在login.html登錄按鈕有type="submit"代替type="button"：

<button type="submit" ng-disabled="form.$invalid" class="btn btn-primary">Login</button>

來源

2016-08-02 09:17:42 Fissio

我改變了按鈕類型爲'提交'，那麼它也不起作用。 – Kishan

我沒有收到任何類型的控制檯錯誤或任何東西。這就是爲什麼我無法弄清楚的原因 – Kishan

如果你在'$ scope.login'的第一行添加一個'console.log'，它會顯示出來嗎？只是爲了確保這在AuthenticationService中不是問題。嘗試在loginController函數的第一行添加一個'console.log'行，以檢查控制器是否正在初始化。此外，請確保舊的login.js沒有被緩存，因此請檢查該按鈕實際上是否使用瀏覽器html檢查器鍵入='submit'。除此之外，不知道可能是什麼問題...... – Fissio

只是刪除從控制器的$ rootScope注入器，因爲它沒有作爲參數傳遞給控制器函數。並且它的工作原理是

來源

2016-08-02 11:57:47 Kishan

控制器沒有在angularjs中調用

回答

相關問題