这是我第三次学习AngularJS，而且我很挣扎。我需要帮助。我不断收到TypeError: customerFactory.getOrders is not a function我已经检查过几次错字，但是找不到。
customerController.js
angular.module('myApp')
.controller('CustomersController', function ($scope, $log, customerFactory, appSettings) {
'use strict';
$scope.sortBy = 'name';
$scope.reverse = false;
$scope.customers = [];
$scope.appSettings = appSettings;
function init (){
customerFactory.getCustomers()
.success(function(customers) {
$scope.customers = customers;
})
.error(function(data, status, headers, config) {
//error handler
$log.log(data.error + ' ' + status);
});
}
init();
$scope.doSort = function (propName) {
$scope.sortBy = propName;
$scope.reverse = !$scope.reverse;
};
});
allorders.html
<h3>Customer Orders</h3>
<br/>
Filter: <input type="text" ng-model="orderFilter.product" />
<br/><br/>
<table>
<tr>
<th>Product</th>
<th>Total</th>
</tr>
<tr ng-repeat="order in orders | filter:orderFilter | orderBy:'name'">
<td>{{ order.product }}</td>
<td>{{ order.total | currency:'PLN' }}</td>
</tr>
<tr ng-class="totalType">
<td> </td>
<td>{{ ordersTotal | currency:'PLN' }}</td>
</tr>
</table>
allOrderscontroller.js
(function() {
var AllOrdersController = function ($scope, customerFactory) {
$scope.orders = null;
$scope.ordersTotal = 0.0;
$scope.totalType;
function init() {
customerFactory.getOrders()
.success(function(orders) {
$scope.orders = orders;
getOrdersTotal();
})
.error(function(data, status, headers, config) {
//handle error
});
}
function getOrdersTotal() {
var total = 0;
for (var i = 0, len = $scope.orders.length; i < len; i++) {
total += $scope.orders[i].total;
}
$scope.ordersTotal = total;
$scope.totalType = ($scope.ordersTotal > 100) ? 'success' : 'danger';
}
init();
};
AllOrdersController.$inject = ['$scope', 'customerFactory'];
angular.module('myApp')
.controller('AllOrdersController', AllOrdersController);
}());
index.html
<!doctype html>
<html ng-app="myApp">
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<meta content="utf-8" http-equiv="encoding">
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://code.angularjs.org/1.4.5/angular.js"></script>
<script src="angular-route.js"></script>
<script src="app/controllers/app.js"></script>
<script src="app/controllers/customersController.js"></script>
<script src="app/controllers/ordersController.js"></script>
<script src="app/services/customersFactory.js"></script>
<script src="app/services/values.js"></script>
<script src="app/controllers/allOrdersController.js"></script>
</head>
<body>
<header>
<nav class="navbar navbar-default">
<ul class="nav navbar-nav">
<li><a href="#/customers">Customers</a></li>
<li><a href="#/orders">Orders</a></li>
</ul>
</nav>
</header>
<div ng-view></div>
</body>
</html>
我只是想显示
allorders.html的内容。安慰
TypeError: customerFactory.getOrders is not a function
at init (http://localhost:3000/app/controllers/allOrdersController.js:9:19)
at new AllOrdersController (http://localhost:3000/app/controllers/allOrdersController.js:28:2)
at invoke (https://code.angularjs.org/1.4.5/angular.js:4473:17)
at Object.instantiate (https://code.angularjs.org/1.4.5/angular.js:4481:27)
at https://code.angularjs.org/1.4.5/angular.js:9108:28
at link (http://localhost:3000/angular-route.js:977:26)
at invokeLinkFn (https://code.angularjs.org/1.4.5/angular.js:8746:9)
at nodeLinkFn (https://code.angularjs.org/1.4.5/angular.js:8246:11)
at compositeLinkFn (https://code.angularjs.org/1.4.5/angular.js:7637:13)
at publicLinkFn (https://code.angularjs.org/1.4.5/angular.js:7512:30) <div ng-view="" class="ng-scope">
如果有人可以，请帮忙。整天几乎坐了几天:(。
编辑
customerFactory.js
(function() {
var customerFactory = function($http) {
var factory = {};
factory.getCustomers = function() {
return $http.get('/customers');
};
factory.getCustomer = function(customerId) {
return $http.get('/customers/' + customerId);
};
factory.getOrders = function() {
return $http.get('/orders');
}
return factory;
};
customerFactory.$inject = ['$http'];
angular.module('myApp').factory('customerFactory', customerFactory);
}());
我试图在
server.js中写一条订单路线，如下所示：app.route('/orders')
.get(function(req, res)) {
var orders = [];
for (var i = 0, len = customers.length; i < len; i++) {
orders += customers[i][orders];
}
return orders;
}
})
我正在尝试从
customers中的server.js数组收集所有订单。没有进展。我究竟做错了什么？这是我的server.js
var express = require('express'),
app = express();
/* EXPRESS 3.0
app.configure(function () {
app.use(express.static(__dirname, '/'));
});
*/
// EXPRESS 4.0
var env = process.env.NODE_ENV || 'development';
if ('development' == env) {
// configure stuff here
app.use(express.static(__dirname + '/'));
}
/*EXPRESS 3.0
app.get('/customers/:id', function(req, res) {
var customerId = parseInt(req.params.id);
var data = {};
for (var i = 0, len = customers.length; i < len; i++) {
if (customers[i].id === customerId) {
data = customer[i];
break;
}
}
res.json(data)
});
*/
//EXPRESS 4.0
app.route('/customers/:id')
.get(function(req, res) {
var customerId = parseInt(req.params.id);
var data = {};
for (var i = 0, len = customers.length; i < len; i++) {
if (customers[i].id === customerId) {
data = customers[i];
break;
}
}
res.json(data)
})
/* EXPRESS 3.0
app.get('/customers', function(req, res) {
res.json(customers);
});
*/
//EXPRESS 4.0
app.route('/customers')
.get (function(req, res) {
return res.json(customers);
})
app.route('/orders')
.get(function(req, res)) {
var orders = [];
for (var i = 0, len = customers.length; i < len; i++) {
orders += customers[i][orders];
}
return orders;
}
})
app.listen(3000);
console.log('Express listening on port 3000');
var customers = [
{
id: 1,
joined: '2005-09-07',
name: 'Mayweather',
city: 'Brooklyn',
orderTotal: '43.1299',
orders: [
{
id: 1,
product: 'Pencils',
total: 9.9956
}
]
},
{
id: 2,
joined: '2005-09-07',
name: 'Jason',
city: 'Cleveland',
orderTotal: '89.8933',
orders: [
{
id: 1,
product: 'iPad',
total: 20.9956
}
]
},
{
id: 3,
joined: '1999-08-27',
name: 'Jade',
city: 'Wroclaw',
orderTotal: '77.0092',
orders: [
{
id: 1,
product: 'Pillows',
total: 12.2311
}
]
},
{
id: 4,
joined: '2015-09-01',
name: 'David',
city: 'Accra',
orderTotal: '13.8465',
orders: [
{
id: 1,
product: 'Serek',
total: 11.4782
}
]
},
{
id: 5,
joined: '2001-01-18',
name: 'Doyet',
city: 'Paris',
orderTotal: '23.9930',
orders: [
{
id: 1,
product: 'Serek',
total: 11.4782
}
]
}];
最佳答案
因此，查看您的customerFactory尚无要调用的getOrders函数，因此为什么从init中的allOrdersController函数进行调用时会触发错误。