未知的提供者factoryprovider <-factory <-controller angular js

Question

從服務到控制器注入依賴項時遇到問題。 雖然我添加了它，但仍然存在相同的錯誤

未知提供者：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”，但是在控制器中，您正在使用“ 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;
}]);

Answer 2

當您的工廠未向angular注冊時，就會出現該錯誤。 更改為

app.factory('websiteFactory', ['$http', '$location', function ($http, $location) {
    ...do something here...
}