Question

gulp minify后我收到错误：Uncaught Error: [$injector:unpr] http://errors.angularjs.org/1.5.8/$injector/unpr?p0=nProvider%20%3C-%20n

什么可能导致此错误？我使用jScroll进行自动分页，当我添加另一个页面时，我必须在页面上编译添加的项目。它在运行gulp时正常工作，但在gulp --production之后无效。

paginationCtrl.js

(function () {

'use strict';

app.controller('paginationCtrl', [
'$scope', '$alert', '$http', '$timeout', '$compile',
function ($scope, $alert, $http, $timeout, $compile) {

    $scope.compileElements = function () {
        $('.jscroll-inner').each(function () {
            var content = $(this);
            angular.element(document).injector().invoke(function($compile) {
                var scope = angular.element(content).scope();
                $compile(content)(scope);
                $scope.$apply();
            });
        });
    }

    $(document).ready(function(){
        $('.scroll-element').jscroll({
            loadingHtml: "",
            autoTrigger: true,
            nextSelector: '.scroll-pagination',
            contentSelector: '.scroll-element',
            callback: function() {
                $('ul.pagination:visible:first').hide();
                $scope.$digest();
                angular.element(document).ready(function () {
                    $scope.compileElements();
                });
            }
        });
    });
}]);
})();

gulpfile.js

var gulp = require('gulp');
var notify = require("gulp-notify");
var mainBowerFiles = require('main-bower-files');

var elixir = require('laravel-elixir');
require('laravel-elixir-livereload');
require('laravel-elixir-vueify');

gulp.task('bower', function() {
    return gulp.src(mainBowerFiles())
        .pipe(gulp.dest('resources/assets/js/vendor'))
        .pipe(notify("Success: Bower Installments!"));
});

elixir(function(mix) {
    mix.sass(['main.scss'], 'public/assets/css/main.css')
        .scripts([
            'resources/assets/js/vendor/jquery.min.js',
            'resources/assets/js/vendor/angular.min.js',
            'resources/assets/js/vendor/moment.min.js',
            'resources/assets/js/vendor/jquery.pjax.js',
            'resources/assets/js/vendor/jquery.timepicker.min.js',
            'resources/assets/js/vendor/**/*.js',
            ], 'public/assets/js/vendor.js')
        .scriptsIn('resources/assets/js/app', 'public/assets/js/app.js')
        .version([
            'assets/css/main.css', 
            'assets/js/vendor.js', 
            'assets/js/app.js', 
        ])
        .livereload([ 'app/**/*', 'public/build/**/*', 'resources/views/**/*' ]);
});

Answer 1

你有这段代码：

angular.element(document).injector().invoke(function($compile) {
    var scope = angular.element(content).scope();
    $compile(content)(scope);
    $scope.$apply();
});

在缩小之前，你要求角度注入$compile。缩小之后，您要求Angular注入n，之后Angular会抛出错误的未知提供者：nProvider。

最简单的修复是使用array notation进行缩小安全依赖注入。所以这段代码变成了：

angular.element(document).injector().invoke(['$compile',function($compile) {
    var scope = angular.element(content).scope();
    $compile(content)(scope);
    $scope.$apply();
}]);

gulp缩小后角度注射器（）不工作

1 个答案: