CODEWITHSUNDEEP
javascripthtmlangularjs
Asad Arshad
Asad Arshad

Reputation: 55

Referenced Error: angular is not defined in app.js line 1

index.js

angular.module("travel")

.controller('LoginCtrl', function($scope, AuthService, $ionicPopup, $state) {
  $scope.user = {
    name: '',
    password: ''
  };

  $scope.login = function() {
    AuthService.login($scope.user).then(function(msg) {
      $state.go('inside');
    }, function(errMsg) {
      var alertPopup = $ionicPopup.alert({
        title: 'Login failed!',
        template: errMsg
      });
    });
  };
})

.controller('RegisterCtrl', function($scope, AuthService, $ionicPopup, $state) {
  $scope.user = {
    name: '',
    password: ''
  };

  $scope.signup = function() {
    AuthService.register($scope.user).then(function(msg) {
      $state.go('outside.login');
      var alertPopup = $ionicPopup.alert({
        title: 'Register success!',
        template: msg
      });
    }, function(errMsg) {
      var alertPopup = $ionicPopup.alert({
        title: 'Register failed!',
        template: errMsg
      });
    });
  };
})

.controller('InsideCtrl', function($scope, AuthService, API_ENDPOINT, $http, $state) {
  $scope.destroySession = function() {
    AuthService.logout();
  };

  $scope.getInfo = function() {
    $http.get(API_ENDPOINT.url + '/memberinfo').then(function(result) {
      $scope.memberinfo = result.data.msg;
    });
  };

  $scope.logout = function() {
    AuthService.logout();
    $state.go('outside.login');
  };
})

.controller('AppCtrl', function($scope, $state, $ionicPopup, AuthService, AUTH_EVENTS) {
  $scope.$on(AUTH_EVENTS.notAuthenticated, function(event) {
    AuthService.logout();
    $state.go('outside.login');
    var alertPopup = $ionicPopup.alert({
      title: 'Session Lost!',
      template: 'Sorry, You have to login again.'
    });
  });
});

app.js

angular.module("travel" ,['ionic'])

.config(function($stateProvider, $urlRouterProvider) {

  $stateProvider
  .state('outside', {
    url: '/outside',
    abstract: true,
    templateUrl: 'templates/outside.html'
  })

index.html

  <!DOCTYPE html>
    <html>
        <head>

            <script type="text/javascript" src="angular.js"></script>
            <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.1/angular.js"></script>
            <script src="js/app.js"></script>
            <script src="js/controllers.js"></script>
            <script src="js/services.js"></script>
            <script src="js/constants.js"></script>       
            <link rel="stylesheet" type="text/css" href="css/index.css">
            <title>FinalYearProject</title>
        </head>
        <body ng-app="travel" ng-controller="AppCtrl">
            <ui-view></ui-view>
        </body>
    </html>

i'm getting angular js not defined error by adding cdn of angular now i'm getting the error like 'travel' module is not found Anugular js code is also updated as index js Please help me in this error

Upvotes: 0

Views: 2077

Answers (2)

Kaushik Thanki
Kaushik Thanki

Reputation: 3510

HTML: 

    <!DOCTYPE html>
    <html>
    <head>
        <script src="../bower_components/angular/angular.min.js"></script>
        <script src="../bower_components/angular-ui-router/release/angular-ui-router.min.js"></script>
// Some ionic reference
        <script src="app.js"></script>
        <script src="index.js"></script>
        <title>FinalYearProject</title>
    </head>
    <body ng-app="travel" ng-controller="AppCtrl">
        <div ui-view>
            {{1+1}}
        </div>
    </body>
    </html>

app.js

(function () {
    'use strict';
    var app = angular.module('travel', ['ui.router','ionic']);
    //Configuration for Angular UI routing.
    app.config([
        '$stateProvider', '$urlRouterProvider',
        function ($stateProvider, $urlRouterProvider, $locationProvider) {
            $stateProvider
                .state('outside', {
                    url: '/outside',
                    template: '<h1>My Contacts</h1>'
                });
            $urlRouterProvider.otherwise('/outside');
        }
    ]);
})();

Upvotes: 1

user7246809
user7246809

Reputation:

The angular js not defined error might be caused because maybe the cdn couldn't be reached. So the angular variable is not created and this, when in your app.js the line angular.module("travel" ,['ionic']) is reached, angular is not found.

On the other hand your "travel" module is properly defined.

Upvotes: 0

Related Questions