javascript - 未知提供商factoryprovider <- 工厂<- Controller Angular js

Question

我在将服务的依赖项注入(inject)到 Controller 时遇到问题。虽然我添加了它，但仍然出现相同的错误

Unknown provider: websiteFactoryProvider <- websiteFactory <- listCtrl

我基本上需要将 ng-view 渲染到我的 index.html

Index.html

<div ng-view>

</div>

app.js

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

app.config(['$routeProvider', function ($routeProvider) {
    $routeProvider.

    when('/list', {
        templateUrl: 'app/views/list.html', controller: 'listCtrl'
    }).

    otherwise({
        redirectTo: '/list'
    });

}]);

websiteService.js

app.factory('webiteFactory', ['$http', '$location', function ($http, $location) {

    var factory = {};

    // method that return all websites from an http request
    factory.getAllWebsites = function () {
        return $http.get("http://localhost/Replicate/GetAllWebsites");
    }

    //method that returns an object from given array
    factory.getFilteredObject = function (list, websiteName) {
        for (i = 0 ; i < list.length ; i++) {
            if (list[i].Name == websiteName)
                return list[i];
        }
    }


    return factory;
}]);


/* application services that would not return values */
app.service('websiteService', ['$http', function ($http) {

    //service for pagination
    this.paginate = function ($scope) {

        //pagination code
        $scope.currentPage = 1;
        $scope.totalItems = $scope.model.length;
        $scope.numPerPage = 10;
        $scope.paginate = function (value) {
            var begin, end, index;
            begin = ($scope.currentPage - 1) * $scope.numPerPage;
            end = begin + $scope.numPerPage;
            index = $scope.model.indexOf(value);
            return (begin <= index && index < end);
        };


        //ordering code
        $scope.reverse = true;
        $scope.order = function (predicate) {
            $scope.reverse = ($scope.predicate === predicate) ? !$scope.reverse : false;
            $scope.predicate = predicate;
        };
    }

    //service to change state of a website
    this.changeSiteState = function (website) {
        var newState = website.State == "Stopped" ? "Started" : "Stopped";
        $http({
            method: 'POST',
            url: '/Replicate/ChangeState/',
            data: JSON.stringify({ webName: website.Name, state: newState }),
            headers: { 'Content-Type': 'application/json' }
        }).success(function (data) {
            if (data == "success") {
                website.State = website.State == "Stopped" ? "Started" : "Stopped";
            }
            else {
                alert(data);
            }

        }).error(function (data, status, headers, config) {
            alert(data);
        });
    }
}])

listCtrl.js

app.controller('listCtrl', function websiteCtrl($scope, $location, websiteFactory, websiteService, $modal) {

    //function triggered at the intialization of controller
    $scope.init = function () {
        $scope.model = [];
        setTimeout(function () {
            websiteFactory.getAllWebsites().success(function (data) {
                $scope.model = data;
                websiteService.paginate($scope);
            })
        }, 0);
    };

    //delegation of change state to service method
    $scope.changeState = function (website) {
        websiteService.changeSiteState(website);
    }

    //open modal and shows details of single object
    $scope.showDetails = function (websiteName) {
        var modalInstance = $modal.open({
            templateUrl: '../Views/Replicate/Details.html',
            controller: 'DetailsCtrl',
            resolve: {
                obj: function () {
                    return websiteFactory.getFilteredObject($scope.model, websiteName);
                }
            }
        });
    }

});

Answer 1

您拼错了“websiteFactory”。在您的工厂定义代码中，它是“webiteFactory”，但在 Controller 中，您使用“websiteFactory”以不同的名称获取它，这就是为什么它无法找到此提供程序并产生错误: 更改:

app.factory('websiteFactory', ['$http', '$location', function ($http, $location) {

    var factory = {};

    // method that return all websites from an http request
    factory.getAllWebsites = function () {
        return $http.get("http://localhost/Replicate/GetAllWebsites");
    }

    //method that returns an object from given array
    factory.getFilteredObject = function (list, websiteName) {
        for (i = 0 ; i < list.length ; i++) {
            if (list[i].Name == websiteName)
                return list[i];
        }
    }


    return factory;
}]);