错误: [$injector:modulerr] 无法实例化模块 ngFileUpload



我使用 NuGet 安装了 Angular 文件上传 12.2.13,感觉我已经正确注入了依赖项,但仍然收到以下错误:

角度.js:63 未捕获错误:[$injector:模块rr] 由于以下原因,无法实例化模块核心电源: 错误: [$injector:modulerr] 由于以下原因,无法实例化模块 ngFileUpload: 错误: [$injector:nomod] 模块"ng文件上传"不可用!您要么拼错了模块名称,要么忘记加载它。如果注册模块,请确保将依赖项指定为第二个参数。

我在安装时没有收到任何错误,可以看到它在我的解决方案中注册。

以下是我的应用模块中的注入:

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

在我尝试使用它的控制器中:

corePower.controller('newComponentController', ['$scope', 'Upload', '$timeout', function ($scope, Upload, $timeout) {
$scope.uploadPic = function (file) {
file.upload = Upload.upload({
url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
data: { username: $scope.username, file: file },
});
file.upload.then(function (response) {
$timeout(function () {
file.result = response.data;
});
}, function (response) {
if (response.status > 0)
$scope.errorMsg = response.status + ': ' + response.data;
}, function (evt) {
// Math.min is to fix IE which reports 200% sometimes
file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
});
}
}]);

我确实想知道这是否与我们使用的是使用 gulp 的模板有关,而且由于我不熟悉 gulp,因此在角度方面已经让我头疼。

以下是我们的gulp文件:

/// <binding BeforeBuild='default' Clean='clean' />
"use strict";
var gulp = require("gulp"),
rimraf = require("rimraf"),
concat = require("gulp-concat"),
cssmin = require("gulp-cssmin"),
uglify = require("gulp-uglify"),
less = require("gulp-less"),
rtlcss = require("gulp-rtlcss");
var paths = { webroot: "./wwwroot/" };
paths.components = paths.webroot + 'components/';
// Sources
paths.js = [
paths.components + 'app.js',
paths.components + '**/*.js'
];
//paths.minJs = paths.webroot + "master/js/**/*.min.js";
paths.css = paths.webroot + "css/**/*.css";
//paths.minCss = paths.webroot + "css/**/*.min.css";
paths.less = paths.components + "**/*.less";
paths.lessWatch = paths.less;
// Dests
paths.concatJsDest = paths.webroot + "js";
paths.concatCssDest = paths.webroot + "css";
gulp.task("clean:js", function (cb) {
rimraf(paths.concatJsDest, cb);
});
gulp.task("clean:css", function (cb) {
rimraf(paths.concatCssDest, cb);
});
gulp.task("clean", ["clean:js", "clean:css"]);
gulp.task("min:js", function () {
return gulp.src(paths.js)
.pipe(concat('app.js'))
//.pipe(uglify())
.pipe(gulp.dest(paths.concatJsDest));
});
// ew
gulp.task('js:watch', function () {
gulp.watch(paths.js, ['min:js']);
});
gulp.task('less:app', function () {
gulp.src(paths.less)
.pipe(less())
.on('error', function (err) {
console.log(err);
})
.pipe(concat('app.css'))
.pipe(gulp.dest(paths.concatCssDest));
});
gulp.task('less:watch', function () {
gulp.watch(paths.lessWatch, ['less']);
});
gulp.task('less', ['less:app']);
gulp.task('rtl', function () {
gulp.src(paths.css)
.pipe(rtlcss())
.pipe(gulp.dest(paths.concatCssDest));
});
gulp.task("min:css", ["less"], function () {
gulp.src(paths.css)
.pipe(cssmin())
.pipe(gulp.dest(paths.concatCssDest));
});
gulp.task("min", ['min:css', 'min:js']);
gulp.task("watch", ['less:watch', 'js:watch']);
gulp.task("default", ["min:js", "less"]);

请注意,我关闭了 js 缩小中的丑化,因为它会导致一些问题变得有角度地工作。

gulp.task("min:js", function () {
return gulp.src(paths.js)
.pipe(concat('app.js'))
//.pipe(uglify())
.pipe(gulp.dest(paths.concatJsDest));
});

还可以快速浏览我的Visual Studio 2017解决方案缺陷,以防它有帮助

非常感谢任何建议!

您是否在索引中添加了.js文件.html

<script src="ng-file-upload.min.js"></script>

最新更新