1

I am making an AngularJS app,in which I am using Express as backend. The problem is,whenever I run my app

angular.js:36Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.0-beta.14/$injector/modulerr?p0=starter&p1=….com%2Fajax%2Flibs%2Fangularjs%2F1.3.0-beta.14%2Fangular.min.js%3A18%3A139)

Above error occurs in browser's console. I have tried many solutions but none of them worked.

My index.html is

 <!DOCTYPE html>
<html ng-app="starter">
  <head>
  <meta charset="utf-8">
  <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title>AngularJS Routing example</title>
    <script src="hhtp://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.14/angular.min.js"></script>
    <script src="http://localhost/try/www/js/ng-cordova.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>
    </head>

  <body>
    <div class="container">
        <div class="row">
        <div class="col-md-3">
            <ul class="nav">

            </ul>
        </div>
        <div class="col-md-9">
            <div ng-view></div>
        </div>
        </div>
    </div>
    <script src="http://localhost/try/www/js/app.js"></script>
    <script src="http://localhost/try/www/js/master_serverquery.js"></script>
    <script src="http://localhost/try/www/js/employeeCtrl.js"></script>
  </body>
</html>

My login.html is

<!DOCTYPE html>
<html  >

<head>
    <meta charset="utf-8">
    <title>Daily UI - Day 1 Sign In</title>
    <link href='https://fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700|Lato:400,100,300,700,900' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="http://localhost/try/www/css/animate.css">
    <link rel="stylesheet" href="http://localhost/try/www/css/style.css">
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-beta.14/angular.min.js"></s‌​cript>
    <script src="http://localhost/try/www/js/ng-cordova.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-route.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.7/angular-resource.min.js"></script>

</head>

<body ng-app="starter" >
    <div ng-controller="loginCtrl">
        <div class="top">
            <h1 id="title" class="hidden"><span id="logo"></span></h1>
        </div>
        <div class="login-box animated fadeInUp">
            <div class="box-header">
                <h2>Log In</h2>
            </div>
                <form method="POST">
                    <label for="username">Username</label>
                    <br/>
                    <input type="text" name = "login" ng-model="loginId">
                    <br/>
                    <label for="password">Password</label>
                    <br/>
                    <input type="password" name = "password" ng-model = "loginPassword" >
                    <br/>
                    <button type="submit" ng-click = "loginFunc()">Sign In</button>
                    <br/>
                    <a href="#home"> Add New Order </a>
               </form>
            <a href="#"><p class="small">Forgot your password?</p></a>
        </div>
    </div>

<script src="http://localhost/try/www/js/app.js"></script>
<script src="http://localhost/try/www/js/master_serverquery.js"></script>

</body>
</html>

My app.js is

var app = angular.module('starter', ['ngRoute','ngCordova']);
console.log("error")
app.run(function( $cordovaSQLite) {
    db = window.openDatabase("marketplace.db", '1', 'my', 1024 * 1024 * 100); 
    $cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS user_master_vendor (server_db_column_id integer, name text)");
    console.log("browser");
});
 app.config(['$routeProvider',
   function($routeProvider) {
     $routeProvider.
       when('/login', {
        templateUrl: 'template/login.html',
        controller: 'loginCtrl'
    }).
       otherwise({
        redirectTo: '/login'
       });
 }]);

app.run(function($rootScope){
     $rootScope.project_url = 'http://127.0.0.1:8081';
})

app.controller('loginCtrl',function($scope, $http, $rootScope ,$location, $cordovaSQLite){
    $scope.loginFunc = function($scope){
        var loginPassword = $scope.loginPassword;
        var loginId = $scope.loginId;
        console.log("   loginCtrl");
        $scope.user = {
            loginId : loginId,
            loginPassword : loginPassword
        }
        alert($scope.user.loginId);
        var loginUrl = $rootScope.project_url + '/login_post';
            $http({
                    method : 'POST',
                    url : loginUrl,
                    headers: {
                                'Content-Type': undefined
                            },
                    params: {
                                loginId : loginId,
                                loginPassword : loginPassword
                            },
                    dataType: 'json',
                    processData : false
            }).then(function successCallback(response) {
                            console.log(response.data.result[0].Emp_Id);
                            console.log(response.data.result[0].Emp_Password);
                            console.log("successCallback called");

                            var server_db_column_id =  response.data.result[0].Id;
                            var user_name = response.data.result[0].Name;
                            $cordovaSQLite.execute(db, 'INSERT INTO user_master_vendor (server_db_column_id, name) VALUES (?, ?)',
                                                                       [server_db_column_id, user_name])
                                  .then(function(result) {
                                      console.log("Data Saved Successfully in user_master at INSERT ID -> " + result.insertId);
                                      console.log("Data user_empId-> " + user_empId + ", user_empPassword->" +user_empPassword);
                                    },
                                    function(error) {
                                      $scope.showp = "Data could not be saved in user_master_vendor Error -> " + error.message;
                                      console.log(error);
                                    });

                }, function errorCallback(response) {
                            alert("failure: "+response);
                });
    }
});
Ajay
  • 4,773
  • 3
  • 23
  • 36
sakshi
  • 39
  • 5
  • when you click on that link what error does it exactly throws...you need to inject components in AngularJS before using it... refer for more info https://docs.angularjs.org/guide/di – Ajay Jul 01 '16 at 11:28
  • You should also update your versions to 1.5. – Luka Jacobowitz Jul 01 '16 at 11:29
  • duplicated? http://stackoverflow.com/questions/18287482/angularjs-1-2-injectormodulerr , http://stackoverflow.com/questions/21045416/angular-js-uncaught-error-injectormodulerr – raduken Jul 01 '16 at 11:30
  • I have tried using 1.5.7 version also,but it didn't work. – sakshi Jul 01 '16 at 11:31
  • @Raduken : It might be same but i feel like everyone has different piece of code.I have also tried the solution in the link provided by you i.e. specifying ng-route in module name.But still it is not working. – sakshi Jul 01 '16 at 11:35
  • Are you really including all the html you provided here in your templates or are you just copy pasting from browser or something? – thepio Jul 01 '16 at 11:51
  • @thepio i've included all the html files and haven't copied either of them. – sakshi Jul 01 '16 at 12:06

1 Answers1

0

Thanks a lot for helping me.I have found the soultion for the problem,it required downloading angular-route module using npm.The below link helped me. https://docs.angularjs.org/api/ngRoute I followed all the steps and was able to solve the problem.

sakshi
  • 39
  • 5