Ошибка типа: customerFactory.getOrders не является функцией

Question

Ошибка типа: customerFactory.getOrders не является функцией

0

Это мое третье обучение AngularJS, и я борюсь. Мне нужна помощь. Я продолжаю получать TypeError: customerFactory.getOrders is not a function я проверил для опечаток несколько раз, но не могу найти.

customersController.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>&nbsp;</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">

Пожалуйста, помогите, если кто-нибудь сможет. Почти целый день сидел целый день :(.

РЕДАКТИРОВАТЬ

customersFactory.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
              }
            ]
          }];

Emanuel 03 сен. 2015, в 23:36

Источник

0

Какое определение для customerFactory ?
PSL 03 сен. 2015, в 20:44
0

Я вижу, что вы используете ng-view, можете ли вы поделиться кодом конфигурации маршрута в app.js , а также поделиться кодом customerFactory . Исходя из того, что вы опубликовали прямо сейчас, я думаю, что вы используете customerFactorty как сервис для вызова некоторого API и, возможно, он еще не возвращает вам объект.
Shaohao Lin 03 сен. 2015, в 20:50
0

я добавил customerFactory в РЕДАКТИРОВАТЬ @PSL
Emmanuel 03 сен. 2015, в 20:50
0

Итак, теперь очевидно, что вы не определили функцию getOrders на заводе и, следовательно, ошибка
PSL 03 сен. 2015, в 20:51
0

@ShaohaoLin Я добавил app.js
Emmanuel 03 сен. 2015, в 20:51
0

factory.getCustomers = function() { return $http.get('/customers'); }; Вы понимаете, как это работает в первую очередь?
Shaohao Lin 03 сен. 2015, в 20:57
0

да, я уже добавил это только сейчас. но тогда я получаю 404 not found что означает, что я, вероятно, должен создать маршрут для него в server.js ?
Emmanuel 03 сен. 2015, в 20:59
0

Вы можете обновить factory код? И да, вы должны также создать маршрут в вашем backend server.js .
Shaohao Lin 03 сен. 2015, в 21:01
1

попробуйте добавить код factory.getOrders = function(customerId) {return $http.get('/orders/' + customerId); };
Shaohao Lin 03 сен. 2015, в 21:04
0

Это должно работать. Дайте мне знать, если все еще есть проблемы!
Shaohao Lin 04 сен. 2015, в 12:56
0

я уже исправил это @ShaohaoLin. большое большое спасибо. Я должен был определить функции getOrders, создать маршрут :)
Emmanuel 04 сен. 2015, в 13:29
0

Хорошая работа, приятель!
Shaohao Lin 04 сен. 2015, в 13:46
0

@ShaohaoLin Теперь мне нужно узнать, как прикрепить базу данных, такую как mongodb, к моему приложению, чтобы люди могли добавлять себя и заказы. Mongodb будет лучшим БД для angularjs? что ты думаешь?
Emmanuel 04 сен. 2015, в 14:57
0

@ siaw23 Да, mongodb будет хорошо. Или вы можете попробовать firebase .
Shaohao Lin 04 сен. 2015, в 18:03
0

спасибо @ShaohaoLin
Emmanuel 04 сен. 2015, в 18:23

Показать ещё 13 комментариев

Теги:

javascript

angularjs

node.js

1 ответ

Ещё вопросы

Какое определение для customerFactory ?
Я вижу, что вы используете ng-view, можете ли вы поделиться кодом конфигурации маршрута в app.js , а также поделиться кодом customerFactory . Исходя из того, что вы опубликовали прямо сейчас, я думаю, что вы используете customerFactorty как сервис для вызова некоторого API и, возможно, он еще не возвращает вам объект.
я добавил customerFactory в РЕДАКТИРОВАТЬ @PSL
Итак, теперь очевидно, что вы не определили функцию getOrders на заводе и, следовательно, ошибка
factory.getCustomers = function() { return $http.get('/customers'); }; Вы понимаете, как это работает в первую очередь?
да, я уже добавил это только сейчас. но тогда я получаю 404 not found что означает, что я, вероятно, должен создать маршрут для него в server.js ?
Вы можете обновить factory код? И да, вы должны также создать маршрут в вашем backend server.js .
попробуйте добавить код factory.getOrders = function(customerId) {return $http.get('/orders/' + customerId); };
Это должно работать. Дайте мне знать, если все еще есть проблемы!
я уже исправил это @ShaohaoLin. большое большое спасибо. Я должен был определить функции getOrders, создать маршрут :)
@ShaohaoLin Теперь мне нужно узнать, как прикрепить базу данных, такую как mongodb, к моему приложению, чтобы люди могли добавлять себя и заказы. Mongodb будет лучшим БД для angularjs? что ты думаешь?
@ siaw23 Да, mongodb будет хорошо. Или вы можете попробовать firebase .

Gareth Whittaker · Accepted Answer · 2015-09-03T19-00-00.000Z

Итак, глядя на ваш customerFactory нет функции getOrders для вызова, но, следовательно, почему ошибка возникает при вызове этого из функции init внутри вашего allOrdersController.

я понял эту часть Забавно, как учебник, которому я следую, который определяет getOrders но все же заставляет приложение работать. если я определю getOrders , которые мне понадобятся, я должен определить маршрут для него тоже верно?
@ siaw23 это зависит. Если вы вызываете API с некоторыми параметрами, такими как customerID=1 , и возвращаете данные для вас. Затем вы должны создать внутренний маршрут, который будет прослушивать этот URI и возвращать данные для вас.
@ShaohaoLin Я попытался добавить маршрут. Можете ли вы проверить, правильно ли я поступаю?