需要帮助使两个模块在AngularJS上运行

时间:2017-10-12 15:30:28

标签: angularjs

我定义了两个模块,所以我可以让应用程序搜索文件(在这种情况下我只放置字符串)和一个模块,通过php将文件上传到服务器。

这两个模块分开工作,但当我尝试将它放在一起时,它会抛出一个错误

angular.min.js:124 Error: [$injector:unpr] http://errors.angularjs.org/1.6.6/$injector/unpr?p0=UploadProvider%20%3C-%20Upload%20%3C-%20uploaderFile
at angular.min.js:7
at angular.min.js:46
at Object.d [as get] (angular.min.js:43)
at angular.min.js:46
at d (angular.min.js:43)
at e (angular.min.js:44)
at Object.invoke (angular.min.js:44)
at P.instance (angular.min.js:95)
at q (angular.min.js:69)
at f (angular.min.js:62)

这是我试图让它发挥作用的JavaScript。

        var app = angular.module('pem', ['comisionList', 'fileUpload']);
        var comisionList = angular.module ('comisionList', []); 
        comisionList.controller("controllerComision", function($scope) {
            $scope.items = [
            {name: "INTOSAI", visible: true},
            {name: "OLACEFS", visible: true},
            {name: "CTPBG", visible: true},
            {name: "COMTEMA", visible: true},
            {name: "CCC", visible: true},
            ];
        });

        var fileUpload = angular.module ('fileUpload', []); 
        fileUpload.controller('uploaderFile', ['$scope', 'Upload', function ($scope, Upload) {
            $scope.submit = function() {
              if ($scope.file) {
                $scope.upload($scope.file);
              }
            };

            $scope.upload = function (file) {
                Upload.upload({
                    url: 'upload.php',
                    method: 'POST',
                    file: $scope.file,
                    data: {file: file, 'username': $scope.username}
                }).then(function (resp) {
                    console.log('Success ' + resp.config.data.file.name + 'uploaded. Response: ' + resp.data);
                }, function (resp) {
                    console.log('Error status: ' + resp.status);
                }, function (evt) {
                    var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
                    console.log('progress: ' + progressPercentage + '% ' + evt.config.data.file.name);
                });
            };
        }]);

这是视图

<!DOCTYPE html>
        <html>
        <head>
            <meta charset="utf-8">
            <meta http-equiv="X-UA-Compatible" content="IE=edge">
            <title>PEM</title>
            <link rel="stylesheet" href="css/bootstrap.min.css">
            <script src="js/angular.min.js"></script>
            <script src="js/ng-file-upload-shim.js"></script>
            <script src="js/ng-file-upload.js"></script>
            <link rel="stylesheet" href="css/style.css">
            <script src="js/mainapp.js"></script>
        </head>
        <body ng-app="pem">
        <div ng-controller="controllerComision">
                <ul>
                    <input type="search" ng-model="search" placeholder="Filtrar Resultados"/>
                      <li ng-repeat="item in items | filter:search as results">
                        {{item.name}}
                     </li>
                </ul>
        </div>
        <div ng-controller="uploaderFile">
            <div class="button" ngf-select ng-model="file" name="file" ngf-pattern="'.pdf'" ngf-accept="'.pdf'">Seleccione Archivo</div>
            <button type="submit" ng-click="submit()">Subir</button>
        </div>
        </body>
        </html>

希望你能帮我解决问题,我认为我没有正确定义模块和/或控制器。

更新

忘记将插件功能中定义的 ngFileUpload 作为另一个模块。

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

抱歉,谢谢!!!!

0 个答案:

没有答案