错误：[ng：areq]参数'UserDataController'不是一个函数，但未定义

我是AngularJS的新手，我试图从我的JSON响应中只存储数组中的我的组名。错误：[ng：areq]参数'UserDataController'不是一个函数，但未定义

我提示以下错误：

angular.js:9997 Error: [ng:areq] Argument 'UserDataController' is not a function, got undefined 
http://errors.angularjs.org/1.2.20/ng/areq?p0=UserDataController&p1=not%20aNaNunction%2C%20got%20undefined 
    at https://code.angularjs.org/1.2.20/angular.js:78:12 
    at assertArg (https://code.angularjs.org/1.2.20/angular.js:1481:11) 
    at assertArgFn (https://code.angularjs.org/1.2.20/angular.js:1491:3) 
    at https://code.angularjs.org/1.2.20/angular.js:7213:9 
    at link (https://code.angularjs.org/1.2.20/angular-route.js:913:26) 
    at nodeLinkFn (https://code.angularjs.org/1.2.20/angular.js:6648:13) 
    at compositeLinkFn (https://code.angularjs.org/1.2.20/angular.js:6039:13) 
    at publicLinkFn (https://code.angularjs.org/1.2.20/angular.js:5934:30) 
    at boundTranscludeFn (https://code.angularjs.org/1.2.20/angular.js:6059:21) 
    at controllersBoundTransclude (https://code.angularjs.org/1.2.20/angular.js:6669:18)

，我已经给所有的CSS，引导文件和位置这是我的索引页。

我的index.html

<!DOCTYPE html> 
    <html ng-app="app"> 

<head> 
    <meta charset="utf-8"/> 
    <title>Groupz</title> 
    <link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" /> 
    <link href="https://cdn.rawgit.com/cornflourblue/angular-registration-login-example/master/app-content/app.css" rel="stylesheet" /> 

<link rel="stylesheet" type="text/css" href="css/login.css"> 

<link rel="stylesheet" type="text/css" href="css/register.css"> 
</head> 

<body> 

<div class="main-wrapper" >  
     <div ng-class="{ 'alert': flash, 'alert-success': flash.type === 'success', 'alert-danger': flash.type === 'error' }" ng-if="flash" ng-bind="flash.message"></div> 
     <div ng-view></div> 
     </div> 


    <div class="credits text-center"> 

    </div> 

    <script src="https://code.jquery.com/jquery-2.0.3.min.js"></script> 
    <script src="https://code.angularjs.org/1.2.20/angular.js"></script> 
    <script src="https://code.angularjs.org/1.2.20/angular-route.js"></script> 
    <script src="https://code.angularjs.org/1.2.13/angular-cookies.js"></script> 


    <script src="app.js"></script> 
    <script src="app-services/authentication.service.js"></script> 

    <!-- real time API storage--> 
    <script src = "app-services/user.service.js"></script> 
    <script src="app-services/flash.service.js"></script> 


    <!-- Fake user service for demo that uses local storage --> 
    <script src="app-services/user.service.js"></script> 
<!-- storage dependency--> 
    <script src="js/ngStorage.min.js"></script> 
    <script src="controller/userdata.controller.js"></script> 
    <script src="controller/login.controller.js"></script> 
    <script src="controller/register.controller.js"></script> 
    <script src="controller/resetpassword.controller.js"></script> 


</body> 

</html>

一旦logined我得到JSON响应如下

{ 
    "json": { 
    "response": { 
     "statuscode": "0", 
     "statusmessage": "Success", 
     "user": [ 
     { 
      "groupname": "School BSK", 
      "membername": "Preethi Ritesh", 
      "session_id": "573eaea74a96c3442a2e45a0" 
     }, 
     { 
      "groupname": " Office", 
      "membername": "Preethi Ritesh", 
      "session_id": "573eaea74a96c3442a2e45a2" 
     }, 
     { 
      "groupname": "Team Developers", 
      "membername": "Preethi Ritesh", 
      "session_id": "573eaea74a96c3442a2e45a4" 
     }, 
     { 
      "groupname": "Pavan School", 
      "membername": "Preethi", 
      "session_id": "573eaea74a96c3442a2e45a6" 
     }, 
     { 
      "groupname": "Shubiksha Apartments", 
      "membername": "Preethi", 
      "session_id": "573eaea74a96c3442a2e45a8" 
     }, 
     { 
      "groupname": "Shubiksha Apartments", 
      "membername": "Rohan Ritesh", 
      "session_id": "573eaea74a96c3442a2e45aa" 
     }, 
     { 
      "groupname": "Little Millenium - Girinagar", 
      "membername": "Preethi", 
      "session_id": "573eaea74a96c3442a2e45ac" 
     }, 
     { 
      "groupname": "Group App Testing", 
      "membername": "Preethi Ritesh", 
      "session_id": "573eaea74a96c3442a2e45ae" 
     }, 
     { 
      "groupname": "Group App Testing", 
      "membername": "Ritesh Kumar", 
      "session_id": "573eaea74a96c3442a2e45b0" 
     }, 
     { 
      "groupname": "Team Analysts", 
      "membername": "Preethi Ritesh", 
      "session_id": "573eaea74a96c3442a2e45b2" 
     }, 
     { 
      "groupname": "Office", 
      "membername": "Preethi", 
      "session_id": "573eaea74a96c3442a2e45b4" 
     }, 
     { 
      "groupname": "Office", 
      "membername": "Rohan Ritesh", 
      "session_id": "573eaea74a96c3442a2e45b6" 
     }, 
     { 
      "groupname": "Office", 
      "membername": "PreethiEngineer", 
      "session_id": "573eaea74a96c3442a2e45b8" 
     }, 
     { 
      "groupname": "Test SR", 
      "membername": "SR Tester", 
      "session_id": "573eaea74a96c3442a2e45ba" 
     }, 
     { 
      "groupname": "Planet Kids Banashankari", 
      "membername": "Preethi Ritesh", 
      "session_id": "573eaea74a96c3442a2e45bc" 
     } 
     ] 
    } 
    } 
}

从上面的响应，我需要只存储组名，成员名称和seperately的SessionID在cookieStore中。

然后我需要列出配置文件页面中的所有组名称。

这是我登录后使用的控制器，我试图将所有组名都推送到需要在我的视图或配置文件页面中查看为列表的数组中。

我userdata.controller.js

(function() { 
    'use strict'; 

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

myApp.controller('UserDataController', function($scope,$localStorage,$http,$q) { 
     $scope.model = { 
    'displayHome' : false, 
    'dropDownData':[] 
     }; 


     $scope.cookietechnology = $localStorage.x; //getting data from cookies 

     if($scope.cookietechnology){ 

     $scope.model.dropDownData = $scope.cookietechnology; 
     $scope.model.selectedValue = $scope.cookietechnology; 
     $scope.model.displayHome = true; 

    } 



    $scope.getData = function(requestedUrl,requestHeader, requestData,requestMethod) { 
    $scope.model.dropDownData = []; 
       var deferred = $q.defer(); 
       var req = { 
        method: requestMethod, 
        url: requestedUrl, 
        headers:{"Content-Type": "application/x-www-form-urlencoded"}, 
        data: requestData 
       }; 

     var user = response.json.response.user; 


      $http(req) 
        .success(function(response) { 
       for(var i=0; i<user.length-1; i++) 
     { 
           console.log("datas : "+response.json.response.user[i].groupzdetails.groupname); 


      $scope.model.dropDownData.push(response.json.response.user[i].groupzdetails.groupname); // we can itterate and set the drop down values 
      $scope.model.selectedValue = response.json.response.user[i].groupzdetails.groupname; // set model value 
     } 
      $localStorage.x = $scope.model.dropDownData; //setting data in cookies 

      $scope.model.displayHome = true; // variable to show and hide home and login 

         deferred.resolve(response); 
        }) 
        .error(function(error) { 
         deferred.reject(error); 
        }); 

       return deferred.promise; 

      };  


}); 
})();

我试图用并试图显示成员名称一样受欢迎的名字我在选择框中的所有组名列出。

我home.view.html

<html ng-app="myApp"> 
    <style> 
     /* Remove the navbar's default margin-bottom and rounded borders */ 

     .navbar { 
      margin-bottom: 0; 
      border-radius: 0; 
      border-color: white; 
      height: 6em; 
      padding-top: 12px; 
      background-color: #2eb2f2; 
     } 
     /* Set height of the grid so .sidenav can be 100% (adjust as needed) */ 

     .row.content { 
      height: 1000px 
     } 
     /* Set gray background color and 100% height */ 

     .sidenav { 
      padding-top: 20px; 
      background-color: #f1f1f1; 
      height: 100%; 
     } 
     /* Set black background color, white text and some padding */ 

     footer { 
      background-color: #555; 
      color: white; 
      padding: 15px; 
     } 
     /* On small screens, set height to 'auto' for sidenav and grid */ 

     @media screen and (max-width: 767px) { 
      .sidenav { 
       height: auto; 
       padding: 15px; 
      } 
      .row.content { 
       height: auto; 
      } 
     } 

     canvas { 
      padding: 0 30px 0 0; 
     } 
    </style> 

<body> 
<nav class="navbar navbar-inverse"> 
    <div class="container-fluid"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar"> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span>       
     </button> 
     <img class="img-responsive" src="css/images/Groupz.png" /> 
    </div> 
    <div class="collapse navbar-collapse" id="myNavbar"> 

     <div class="nav navbar-nav navbar-right" style="padding-top:6px;"> 
     <div class="dropdown"> 
     <span class="badge">5</span><img style="padding-right:10px;" src="css/images/bell1.png" /> 
     <img class="img-circle dropdown-toggle" data-toggle="dropdown" width="40" height="40" src="css/images/image.jpg" /><span class="caret dropdown-toggle" data-toggle="dropdown"></span> 

     <ul class="dropdown-menu"> 
     <li><a href="#/login">Logout</a></li> 
     </ul> 
     </div> 
    </div> 
    </div> 
    </div> 
</nav> 

<div class="container-fluid text-center" ng-controller="UserDataController as ctrl"> 
    <div class="row content" style="margin-top:100px; color:rgba(51, 122, 183, 1);" ng-if="!model.displayHome"> 
     <button ng-click="getData('json_resp.json','','','GET')">Click to login</button> 
    </div> 
     <div class="row content" ng-if="model.displayHome"> 
      <div class="col-sm-2 sidenav"> 
     <div class="well well-lg col-xs-30" style="background-color: green;" ng-show="true"> 

     <img class="img-responsive" style="padding-bottom:10px;" src="css/images/image.jpg" /> 
     <div class="form-group"> 
      <select class="form-control" ng-model="model.selectedValue" name="groupname"> 
       <option value='' disabled> Switch Account </option> 
        <option ng-repeat="item in model.dropDownData track by $index" value="{{item}}">{{item}}</option> 
        </select> 
        </div> 
       </div> 
     <div class="collapse navbar-collapse navbar-ex1-collapse"> 
    <ul class="nav navbar-nav"> 
     <li><a href="#/dashboard"><span class="glyphicon glyphicon-dashboard vmenu"></span> Dashboard</a> 
     </li> 
     <li class="#/Profile"><a href="#/"><span class="glyphicon glyphicon-user vmenu"></span>Profile</a> 
     </li> 
     <li><a href="#/Account"><span class="glyphicon glyphicon-edit vmenu"></span>Account</a> 
     </li> 
     <li><a href="#/Dropbox"><span class="glyphicon glyphicon-tags vmenu"></span>Dropbox</a> 
     </li> 
     <li><a href="#/Checklist"><span class="glyphicon glyphicon-off vmenu"></span>Checklist</a> 
     </li> 
     <li><a href="#/Report"><span class="glyphicon glyphicon-off vmenu"></span>Report</a> 
     </li> 
     <li><a href="#/Settings"><span class="glyphicon glyphicon-off vmenu"></span>Settings</a> 
     </li> 
     <li><a href="#/Help"><span class="glyphicon glyphicon-off vmenu"></span>Help</a> 
     </li> 
    </ul> 

    </div> 
    </div> 

    <div class="col-sm-8 text-left"> 
     <h1>Welcome</h1> 
     <h6 class="page-header ng-binding" ng-model="membername">{{membername}}</h6> 

</div> 
</div> 
    </div> 
<footer class="container-fluid text-center"> 
    <p>Groupz</p> 
</footer> 

</body> 
</html>

来源

2016-05-24 Kalaiyarasi M

谢谢你我得到了它 –

OP，你会在下面添加你的解决方案作为额外的答案吗？ – halfer

Working Demo

你应该包括ngStorage.js。

<script src="https://cdnjs.cloudflare.com/ajax/libs/ngStorage/0.3.10/ngStorage.js"></script>

希望能够解决您的问题。

来源

2016-05-24 09:15:18

现在我得到下面的错误“angular.js：9997错误：[$ injector：unpr]未知的提供者：$ localStorageProvider < - $ localStorage”我删除了[ngStorage]声明，因为我已经使用了脚本。你能告诉我为什么我得到这个错误。 –

“下面的错误”是什么意思？请运行我的plnke，注意没有错误。 –

我从[var myApp = angular.module（'myApp'，['ngStorage']）;“”移除了[ngStorage]因为我正在使用上面的脚本。但现在我得到错误为“angular.js：9997错误：[$ injector：unpr]未知的提供者：$ localStorageProvider < - $ localStorage”我做了什么错误。 –

错误：[ng：areq]参数'UserDataController'不是一个函数，但未定义

回答

相关问题