我是AngularJS的新手，我试图从我的JSON响应中只将我的组名存储在数组中。
我收到以下错误
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，引导文件和位置。
我的索引.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>
登录后，我收到如下 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"
}
]
}
}
}
从上面的响应中，我只需要将组名、成员名和会话 ID 分别存储在 cookieStore 中。
然后我需要在个人资料页面中列出所有组名。
这是我登录后使用的控制器，我正在尝试将所有组名推送到一个数组中，该数组需要在我的视图或配置文件页面中作为列表查看。
My 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;
};
});
}) ();
我正在尝试使用并尝试将成员名称显示为欢迎名称。
我的家视图.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>
工作演示
您应该包括ngStorage.js 。
<script src="https://cdnjs.cloudflare.com/ajax/libs/ngStorage/0.3.10/ngStorage.js"></script>
希望能解决你的问题。