Аз съм нов за ъглови js Искам ред лента за напредък за качване на файлове.
Получавам грешка по-долу, когато пускам кода си:
angular.js:38 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr?p0=app&p1=Error%3A%20%…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A21%3A332)
Ето моя код:
<html ng-app="app">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script>
var app = angular.module("myApp", ["angularFileUpload"])
.controller("MyCtrl", ["$scope","$upload", function MyCtrl($upload) {
// .controller("MyCtrl", function ($scope,$upload){
// var MyCtrl = [ "$scope", "$upload", function($scope, $upload) {
$scope.onFileSelect = function(files) {
var file = files[0];
$scope.upload = $upload.upload({
url: "url",
method: "POST",
withCredentials: true,
data: {type:"uploadzip"},
file: file, // or list of files ($files) for html5 only
}).progress(function(evt) {
console.log("percent: " + parseInt(100.0 * evt.loaded / evt.total));
$scope.progressBar = parseInt(100.0 * evt.loaded / evt.total);
}).success(function(data, status, headers, config) {
console.log("upload succesfully...")
}).error(function(err) {
console.log(err.stack);
})
}
}]);
</script>
</head>
<body >
<div ng-controller="MyCtrl">
<input type="file" ng-file-select="onFileSelect($files)" multiple>
<div ng-scope="progressBar">
</div>
</div>
</body>
</html>
Може ли някой да промени кода ми с необходимата корекция.
Отговори:
0 за отговор № 1В обобщение, имате три въпроса, както са идентифицирани от всички тук. Трябва HTML да се позовава на приложението myapp not. Трябва да бъде:
<html ng-app="myApp">
Вашият html трябва да включва скрипта за качване. В главата си трябва да имате:
<script src="angular-file-upload.min.js"></script>
Вашият контролер трябва да инжектира обхвата:
Трябва да бъде:
.controller("MyCtrl", ["$scope","$upload", function MyCtrl($scope, $upload) {
Съответно се опитвате да замените кода и маркирането със следното.
<html ng-app="myApp">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
<script src="angular-file-upload.min.js"></script>
<script>
var app = angular.module("myApp", ["angularFileUpload"])
.controller("MyCtrl", ["$scope","$upload", function MyCtrl($scope, $upload) {
// .controller("MyCtrl", function ($scope,$upload){
// var MyCtrl = [ "$scope", "$upload", function($scope, $upload) {
$scope.onFileSelect = function(files) {
var file = files[0];
$scope.upload = $upload.upload({
url: "url",
method: "POST",
withCredentials: true,
data: {type:"uploadzip"},
file: file, // or list of files ($files) for html5 only
}).progress(function(evt) {
console.log("percent: " + parseInt(100.0 * evt.loaded / evt.total));
$scope.progressBar = parseInt(100.0 * evt.loaded / evt.total);
}).success(function(data, status, headers, config) {
console.log("upload succesfully...")
}).error(function(err) {
console.log(err.stack);
})
}
}]);
</script>
</head>
<body >
<div ng-controller="MyCtrl">
<input type="file" ng-file-select="onFileSelect($files)" multiple>
<div ng-scope="progressBar">
</div>
</div>
</body>
</html>
2 за отговор № 2
Грешката е включена ng-app директива, вие задавате грешно име на модул. Също така не инжектирате $scope на вашия контролер.
да се промени:
<html ng-app="app">
до това:
<html ng-app="myApp">
0 за отговор № 3
В декларацията на контролера имате ...
.controller("MyCtrl", ["$scope","$upload", function MyCtrl($upload) {
... трябва да имаш ...
.controller("MyCtrl", ["$scope","$upload", function MyCtrl($scope, $upload) {