Fatal编程技术网
  • angularjs/
  • Angularjs 参数'；时钟控制器'；不是函数，未定义

Angularjs 参数'；时钟控制器'；不是函数，未定义

angularjs dependency-injection

Angularjs 参数'；时钟控制器'；不是函数，未定义,angularjs,dependency-injection,angularjs-controlleras,Angularjs,Dependency Injection,Angularjs Controlleras,嗨，我在把我的控制器重构成它们自己的代码片段时遇到了一些问题 我希望控制器从我的初始应用程序声明继承依赖项 "use strict"; angular.module('clockOn', ['angular-contextual-date','logon','milli','mobile','ClockOnController','Auth','ngStorage']) 我需要这些依赖项通过我的控制器 angular.module('clockOn').contro

嗨，我在把我的控制器重构成它们自己的代码片段时遇到了一些问题

我希望控制器从我的初始应用程序声明继承依赖项

    "use strict";
    angular.module('clockOn', ['angular-contextual-date','logon','milli','mobile','ClockOnController','Auth','ngStorage'])
我需要这些依赖项通过我的控制器

      angular.module('clockOn').controller('LogonController',              ['$rootScope','$scope','$location','$localStorage','Auth', 
function($rootScope, $scope, $location, $localStorage,Auth){
创建未知的提供程序错误--我假设依赖项没有向下流动--

创建未定义的函数“controllerName”错误-在这种情况下，我假设我正在重新定义应用程序，因此失去了其他控制器-

这是两个控制器

(function (){
angular.module('clockOn',['Auth','angular-contextual-date'])  
.controller('ClockOnController',     ['$http','Auth','contextualDateService' ,function      ($http,Auth,contextualDateService){
      this.user = Auth.getTokenClaims().user; //authorised is a property of the controller 
      contextualDateService.config.fullDateFormats.thisMonth = "MMM d 'at'  h:mm a ";    
      this.shifts = getShifts(this);

    function getShifts(clockOnCtrl){
      var date = new Date();
      var curr_date = Date.now();
      var week_from_now = Date.now()+"7";

    $http({
      method: 'GET', 
      url: '/shifts', 
      params: {"user_id":clockOnCtrl.user._id,
      "start_at":curr_date,
      "finish_at":week_from_now} 
   }).
   then(function(res){           
     if (typeof res !== 'undefined'){
       console.log(res.data);
       clockOnCtrl.shifts = res.data;         
   }},
   function(error){
     console.log(error)
   });  
}

}]);
})();
我的索引文件

    <!DOCTYPE html>
    <html class="container" ng-app="clockOn"> <!-- ng-app tells the html page which app/module it belongs too runs the store module on load-->
    <head>
      <meta name="viewport" content="width=device-width , initial-scale=1">
      <link rel="stylesheet" type="text/css" href="../resources/bootstrap.min.css"/>
      <link rel="stylesheet" type="text/css" href="../resources/custom.css"/>
    </head>

    <body>  
      <script type="text/javascript" src="../resources/jquery.min.js"></script>    
      <script type="text/javascript" src="../resources/angular.min.js"></script>
      <script type="text/javascript" src="../resources/bower_components/angular-contextual-date/dist/angular-contextual-date.js"></script>     
      <script type="text/javascript" src="../modules/app.js"></script>       
      <script type="text/javascript" src="../modules/logon.js"></script>
      <script type="text/javascript" src="../modules/tasks.js"></script>
      <script type="text/javascript" src="../services/milli.js"></script>
      <script type="text/javascript" src="../services/auth.js"></script>
      <script type="text/javascript" src="../modules/mobile.js"></script>
      <script type="text/javascript" src="../modules/shifts.js"></script>
      <script type="text/javascript" src="../modules/layout-components.js"></script>
      <script type="text/javascript" src="../resources/bower_components/ngstorage/ngStorage.min.js"></script>    
      <script type="text/javascript" src="../controllers/controller-clockOn.js"></script>
      <script type="text/javascript" src="../controllers/controller-logon.js"></script>    
      <script type="text/javascript" src="../controllers/controller-tasks.js"></script> 

<div class="container" ng-controller="ClockOnController as clockOnCtrl">
  <div class= "" ng-controller="LogonController as logonCtrl">
  <logon-form></logon-form>
  <top-menu></top-menu>    
  <div class="page-header" ng-show="token">
    <h2 class="">Welcome {{clockOnCtrl.user.name | uppercase}}
      <small>You currently have {{clockOnCtrl.shifts.length}} shifts</small>
    <h2>
  </div>
  <shifts-list></shifts-list>
  <custom-footer></custom-footer> 
  </div>
</div>
</body> 
</html>


欢迎{{clockOnCtrl.user.name}
您当前有{{clockOnCtrl.shifts.length}}个移位
错误参数'ClockOnController'不是一个函数，未定义

您没有提供控制器的名称，这就是为什么'undefined function'controllerName'我想保持代码简短这是我的LogonControllerdo的完整示例，您使用的是'controllerName'的ctrl-f，基本上不应该这样，因为这种函数不存在。我试图找到你的代码，但找不到：/controllerName是控制器的名称，即我得到的错误参数'ClockOnController'不是函数，未定义
angular.module（'clockOn'，['Auth'，'angular-Context-date']）
：它完全重新定义了'clockOn'模块。如果在每个JS文件中都这样做，那么最终将得到一个clockOn模块，其中只包含最后一个JS文件中添加的组件。只定义一次模块。 
    <!DOCTYPE html>
    <html class="container" ng-app="clockOn"> <!-- ng-app tells the html page which app/module it belongs too runs the store module on load-->
    <head>
      <meta name="viewport" content="width=device-width , initial-scale=1">
      <link rel="stylesheet" type="text/css" href="../resources/bootstrap.min.css"/>
      <link rel="stylesheet" type="text/css" href="../resources/custom.css"/>
    </head>

    <body>  
      <script type="text/javascript" src="../resources/jquery.min.js"></script>    
      <script type="text/javascript" src="../resources/angular.min.js"></script>
      <script type="text/javascript" src="../resources/bower_components/angular-contextual-date/dist/angular-contextual-date.js"></script>     
      <script type="text/javascript" src="../modules/app.js"></script>       
      <script type="text/javascript" src="../modules/logon.js"></script>
      <script type="text/javascript" src="../modules/tasks.js"></script>
      <script type="text/javascript" src="../services/milli.js"></script>
      <script type="text/javascript" src="../services/auth.js"></script>
      <script type="text/javascript" src="../modules/mobile.js"></script>
      <script type="text/javascript" src="../modules/shifts.js"></script>
      <script type="text/javascript" src="../modules/layout-components.js"></script>
      <script type="text/javascript" src="../resources/bower_components/ngstorage/ngStorage.min.js"></script>    
      <script type="text/javascript" src="../controllers/controller-clockOn.js"></script>
      <script type="text/javascript" src="../controllers/controller-logon.js"></script>    
      <script type="text/javascript" src="../controllers/controller-tasks.js"></script> 

<div class="container" ng-controller="ClockOnController as clockOnCtrl">
  <div class= "" ng-controller="LogonController as logonCtrl">
  <logon-form></logon-form>
  <top-menu></top-menu>    
  <div class="page-header" ng-show="token">
    <h2 class="">Welcome {{clockOnCtrl.user.name | uppercase}}
      <small>You currently have {{clockOnCtrl.shifts.length}} shifts</small>
    <h2>
  </div>
  <shifts-list></shifts-list>
  <custom-footer></custom-footer> 
  </div>
</div>
</body> 
</html>