当添加一个服务和一个过滤器或多个服务时,我在做什么导致未知提供者

What am I doing thats causing Unknown Provider when Adding both a service and a filter or multiple services

本文关键字:服务 一个 什么 未知 提供者 添加 过滤器      更新时间:2023-09-26

这很可能是因为我缺乏经验,忽略了一些基本的东西,但介于SO、angularjs教程和指南以及谷歌搜索之间,我找不到可以遵循的解释或示例。

我已经成功地创建了一个工厂,并在我的控制器和过滤器中使用了它,但只有一个或另一个。当我尝试将两者都添加到模块中时,我会得到Error: Unknown provider: memberFactoryProvider <- memberFactory

我的代码如下,但我有一些问题包括:

1。当将工厂和服务(或多个工厂/过滤器)添加到一个模块时,是否足以以与使用单个工厂相同的方式创建它们,即。如果我有很多工厂都是这样的:

'use strict';
angular.module('testApp', [])
    .factory('factory1', function () {
        var obj = {};
        obj.text = "This is a test";
        return obj;
    });
angular.module('testApp', [])
    .factory('factory2', function () {
        var obj = {};
        obj.text = "This is another test";
        return obj;
    });

使用angular.module('testApp', ['factory1', 'factory2']); 在app.js中插入这两个是否足够

2.我在网上注意到一些帖子,当创建过滤器/工厂时,他们会附加应用程序名称,例如:

angular.module('testApp', [])
          .factory('testApp.factory1', function () {
          var obj = {};
          obj.text = "This is a test";
      return obj;});

这是必需的还是个人偏好?

最后,下面是我的所有代码,如上所述,所有代码都是单独工作的,但当我试图将它们组合在一起时,我会收到上面提到的错误,任何建议或帮助都将不胜感激

index.html

<!DOCTYPE html>
<html data-ng-app="testApp">
    <head>
        <title>prototype</title>
        <script type="text/javascript" src="jquery-2.0.3.min.js"></script>
    </head>
    <body>
        <div data-ng-controller="myController">
            <br/>
            <div data-ng-repeat="n in [] | range:5">
                <div data-ng-repeat="">{{test}}</div>
            </div>
        </div>
        <br/>
        <br/>
        <script type="text/javascript" src="angular.min.js"></script>
        <script type="text/javascript" src="js/app.js"></script>
        <script type="text/javascript" src="js/services.js"></script>
        <script type="text/javascript" src="js/filters.js"></script>
        <script type="text/javascript" src="js/controllers.js"></script>
    </body>
</html>

App.js

'use strict';
angular.module('testApp', ['memberFactory', 'range']);

services.js

'use strict';
angular.module('testApp',[])
    .factory('memberFactory', function(){
        var obj = {};
        obj.text = "This is a test";
        return obj;
    });

filters.js

'use strict';
angular.module('testApp',[]).filter('testApp.range', function() {
  return function(input, total) {
    total = parseInt(total);
    for (var i=0; i<total; i++)
      input.push(i);
    return input;
  };
});

控制器.js

function myController($scope, memberFactory){ 
            $scope.test= memberFactory.text;
        }

首先你应该做这个

angular.module('testApp', [])
.factory('factory1', function () {
    var obj = {};
    obj.text = "This is a test";
    return obj;
})
.factory('factory2', function () {
    var obj = {};
    obj.text = "This is another test";
    return obj;
});

您不应该创建两个同名模块。

我认为这个

angular.module('something', ['here', 'is', 'for modules', 'only'];

我想你想做的就是这个。

你有两个模块?

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

那么你应该做

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

然后你将可以访问所有连接到助手和应用的工厂

举个例子,如果你想把过滤器放在另一个文件中,有几种方法可以做到

var filters = angular.module('filters', []);
filters.filter('name', func...);

然后你把它包含在你的应用程序中,就像一样

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