AngularJS从服务内部调用服务-未定义服务

Question

我是 AngularJS 的新手（从 Udemy 课程学习）。我试图通过使用来分离函数（有点像 Java 中的类），所以我使用了多个服务。不知何故，来自控制器的调用工作，但来自另一个服务渲染的调用

"HelperFunctions 未定义

at Object.groceryService.getNewId (app.js:57)"

错误。

它引用的行在“GroceryService”内：

var maxID = HelperFunctions.findMaxID(groceryService.groceryItems);

虽然下面的行可以正常工作，只要它在控制器中：

console.log(HelperFunctions.test);

我的代码供参考：

var app = angular.module('groceryListApp', ["ngRoute"]);

app.controller("GroceryListItemsController", ["$scope", "$routeParams", "$location", "GroceryService", "HelperFunctions", function($scope, $routeParams, $location, GroceryService, HelperFunctions){
    $scope.groceryItems = GroceryService.groceryItems;
    console.log(HelperFunctions.test);
    $scope.groceryItem = { id:7, completed:true, itemName: "cheese", date: new Date() };
    
    $scope.save = function(){
        GroceryService.save($scope.groceryItem);
        $location.path("/");
    }
}]);


app.service("HelperFunctions", function(){
    var findMax = {};
    findMax.test = 7;
    findMax.findMaxID = function(arrayOfGroceries){
        var max = -1;
        for(i=0;i<arrayOfGroceries.length;i++)
        {
            if(arrayOfGroceries[i]>max)
            {
                max = arrayOfGroceries[i].id;
            }
        }
        console.log("a");
        return max;
    }
    return findMax;
    });



app.service("GroceryService", function(){
    var groceryService = {};
    groceryService.groceryItems= [
        {id: 1, completed: true, itemName: 'milk', date: '2014-10-01'}, {id: 2, completed: true, itemName: 'cookies', date: '2014-10-01'},
        {id: 3, completed: true, itemName: 'ice cream', date: '2014-10-02'}, {id: 4, completed: true, itemName: 'potatoes', date: '2014-10-02'},
        {id: 5, completed: true, itemName: 'cereal', date: '2014-10-03'}, {id: 6, completed: true, itemName: 'bread', date: '2014-10-03'},
        {id: 7, completed: true, itemName: 'eggs', date: '2014-10-04'}, {id: 8, completed: true, itemName: 'tortillas', date: '2014-10-04'}     ]

    groceryService.getNewId = function(){
        if(groceryService.newId){
            groceryService.newId++;
            console.log("A" + groceryService.newId);
            return groceryService.newId;
        }
        else{
            var maxID = HelperFunctions.findMaxID(groceryService.groceryItems);
            groceryService.newId = maxID + 1;
            console.log("B" + groceryService.newId);
            return groceryService.newId;
        }
    }
    groceryService.save = function(entry){
        entry.id = groceryService.getNewId();
        groceryService.groceryItems.push(entry);
    };

    return groceryService;
});

这之后也有路由，但我认为这无关紧要，对吧？

Answer 1

HelperFunctions 未定义，因为您尚未将其注入 GroceryService。

这篇文章应该会引导你走向正确的方向：Injecting a service into another service in angularJS。