Modul Fehler in eckigen js

Ich bin neu in eckigen js ich will Fortschritt Strichlinie für Datei-Upload.Modul Fehler in eckigen js

ich unten Störung erhalte, wenn ich meinen Code am laufen:

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)

Hier mein Code:

<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>

Kann jemand meinen Code mit Korrektur erforderlich ändern.

Quelle

2016-10-28 Sapna Mishra

Haben Sie die js-Datei mit der Direktivenerklärung importieren? – Berserk

Sieht aus, als ob Sie ein 'script' -Tag für' angularFileUpload' verpasst haben: https://raw.githubusercontent.com/nervgh/angular-file-upload/master/dist/angular-file-upload.min.js –

If Sie müssen nicht mit dem korrekten Pfad hinzufügen – Berserk

Zusammengefasst haben Sie drei Fragen, wie hier von allen identifiziert. Sie müssen HTML meine App nicht app. Es sollte sein:

<html ng-app="myApp">

Ihre html muss das Skript für Uploads aufzunehmen. In Ihrem Kopf sollten Sie haben:

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

Ihr Steuerungsbereich injizieren sollte:

Es sollte:

.controller('MyCtrl', ['$scope','$upload', function MyCtrl($scope, $upload) {

Dementsprechend versuchen, Ihren Code und Markup und mit dem folgenden zu ersetzen.

<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>

Quelle

2016-10-28 13:46:57 defaultcheckbox

Auf der Controller Erklärung Sie haben ...

.controller('MyCtrl', ['$scope','$upload', function MyCtrl($upload) {

... sollten Sie ...

.controller('MyCtrl', ['$scope','$upload', function MyCtrl($scope, $upload) {

Quelle

2016-10-28 13:10:55 haggisandchips

Der Fehler auf ist ng-app Richtlinie Sie den falschen Modulnamen sind Seeting . Sie injizieren auch nicht $scope auf Ihrem Controller.

Änderung:

<html ng-app="app">

dazu:

<html ng-app="myApp">

Quelle

2016-10-28 13:12:25

Modul Fehler in eckigen js

Antwort

Verwandte Themen