CODEWITHSUNDEEP
angularjs
Vallabh Lakade
Vallabh Lakade

Reputation: 832

AngularJS module creation

I am creating simple angularJS application,but i am stuck at the very first step.I dont know why,but for some reason my module is not getting created and i am getting the following error

Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.14/$injector/modulerr?p0=dataFinderApp&p1=E…gleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.3.14%2Fangular.min.js%3A38%3A135)

Can anyone tell me whats wrong in here?

Here is my code:

<%@ page session="false" %>
<html>
<head>
<title>Upload File Request Page</title>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular-route.min.js"></script>
<script type="text/javascript"">
var sampleApp = angular.module('dataFinderApp',[]);

sampleApp.config(function($routeProvider){

    $routeProvider.when('/',{
        templateUrl : '/upload.jsp', 
        controller : 'mainController'
    })
    .when('/progress',{         
        templateUrl : '/progress.jsp', 
        controller : 'mainController'
    })
    .when('/joblist',{          
        templateUrl : '/joblist.jsp', 
        controller : 'mainController'
    })
    .otherwise({redirectTo : '/'});
});

sampleApp.directive('fileModel', ['$parse', function ($parse) {
    return {
        restrict: 'A',
        link: function(scope, element, attrs) {
            var model = $parse(attrs.fileModel);
            var modelSetter = model.assign;

            element.bind('change', function(){
                scope.$apply(function(){
                    modelSetter(scope, element[0].files[0]);
                });
            });
        }
    };
}]);

sampleApp.service('fileUpload', ['$http', function ($http) {
    this.uploadFileToUrl = function(file, uploadUrl){
        var fd = new FormData();
        fd.append('file', file);
        $http.post(uploadUrl, fd, {
            transformRequest: angular.identity,
            headers: {'Content-Type': undefined}
        })
        .success(function(){
        })
        .error(function(){
        });
    }
}]);

sampleApp.controller('mainController', ['$scope', 'fileUpload', function($scope, fileUpload){

    $scope.uploadFile = function(){
        alert("Vall");
        var file = $scope.myFile;
        console.log('file is ' );
        console.dir(file);
        var uploadUrl = "/uploadFile";
        alert('val');
        fileUpload.uploadFileToUrl(file, uploadUrl);
    };

}]);

</script>
</head>
<body ng-app="dataFinderApp">

<!-- <div ng-controller="mainController">
    <input type="file" file-model="myFile"/>
    <button ng-click="uploadFile()">Upload</button>
</div>

<div ng-view></div>  -->

</body>
</html>

Upvotes: 0

Views: 55

Answers (3)

Abhay
Abhay

Reputation: 6760

You have to use : 

var sampleApp = angular.module('dataFinderApp',['ngRoute']);

This error was occur because you havn't include ngRoute module.

Upvotes: 0

An Nguyen
An Nguyen

Reputation: 800

You can try using the code snippet:

var sampleApp = angular.module('dataFinderApp',['ngRoute']);
sampleApp.config(['$routeProvider', function($routeProvider){.....}]);

Upvotes: 1

Abhilash Augustine
Abhilash Augustine

Reputation: 4208

In AngularJS 1.2.0 and later, ngRoute has been moved to its own module. If you are getting this error after upgrading to 1.2.x or later, be sure that you've installed ngRoute.

Upvotes: 3

Related Questions