2014-12-31 3 views
8

У меня эта ошибка. Я просмотрел ответы, опубликованные ранее, но все же у меня такая же проблема.Uncaught ReferenceError: приложение не определено в Angularjs

index.html

<html lang="en" ng-app="customersApp"> 
<head> 

    <link rel="shortcut icon" href="img/favicon.html"> 

    <title>Vizavoo</title> 

    <!-- Bootstrap core CSS --> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/bootstrap-reset.css" rel="stylesheet"> 
    <link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" /> 

    <!--external css--> 
    <link href="css/slidebars.css" rel="stylesheet"> 
    <!-- Custom styles for this template --> 
    <link href="css/style.css" rel="stylesheet"> 
    <link href="css/style-responsive.css" rel="stylesheet" /> 


</head> 

    <body> 

    <div ng-view></div> 



    <!-- js placed at the end of the document so the pages load faster --> 
     <script src="scripts/angular.js"></script> 
     <script src="scripts/angular-route.js"></script> 
     <script src="app/app.js"></script> 
     <script src="app/controllers/loginController.js"> </script> 
      <script src="js/jquery.js"></script> 
    <script src="js/bootstrap.min.js"></script> 



    </body> 

<!-- Mirrored from thevectorlab.net/flatlab/login.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 08 Dec 2014 06:09:06 GMT --> 
</html> 

app.js

(function(){ 

var app= angular.module('customersApp',['ngRoute']); 

app.config(['$routeProvider', 
    function ($routeProvider) { 
     $routeProvider. 
     when('/login', { 
      title: 'Login', 
      controller: 'loginController', 
       templateUrl: 'app/views/loginuser.html' 
     }) 
      .when('/logout', { 
       title: 'Logout', 
       templateUrl: 'partials/login.html', 
       controller: 'loginController' 
      }) 

      .when('/dashboard', { 
       title: 'Dashboard', 
       templateUrl: 'app/views/dynamic_table.html', 
       controller: 'loginController' 
      }) 
      .when('/signup', { 
       title: 'Signup', 
       templateUrl: 'app/views/registration.html', 
       controller: 'loginController' 
      }) 

      .otherwise({ 
       redirectTo: '/login' 
      }); 
    }]); 

}()); 

loginController.js

app.controller('loginController', function ($scope,$http, Data) { 
    //initially set those objects to null to avoid undefined error 
    $scope.login = {}; 
    $scope.signup = {}; 
    $scope.doLogin = function (customer) { 


     $.post("http://dev.miniluxe.com:4002/email_login", 
    { 

    email : $scope.login.email, 
     password : $scope.login.password 
    }, 
    function(data,status){ 


     data = JSON.parse(data); 
     console.log(data); 

     if(data.log==1) 
     { 

      // window.location.href = "dashboard"; 
      $location.path('dashboard'); 
     } 
     else 
     { 


     alert("wrong username and password"); 
     } 


    }); 


    }; 

    $scope.logout = function() { 
     Data.get('logout').then(function (results) { 
      Data.toast(results); 
      $location.path('login'); 
     }); 
    } 
    app.filter('startFrom', function() { 
    return function(input, start) { 
     if(input) { 
      start = +start; //parse to int 
      return input.slice(start); 
     } 
     return []; 
    } 
}); 






}); 

Пожалуйста, проверьте код и скажите мне, где я делаю ошибку.

+0

Почему вы обертываете свой код app.js анонимной функцией? –

+0

Я прочитал курс Дэна Вахлина ... они сделали так, чтобы я следовал их методу – Prince

+0

Это не требуется. Это ограничивает область действия переменной 'app' только этой функцией, и вы пытаетесь использовать ее в другом файле. Просто удалите эту анонимную функцию, и она запустится. –

ответ

7

Это хороший урок по сфере применения. Обертка вещей в анонимных функциях (function(){...}());) будет содержать переменные, объявленные внутри этой функции, невидимые для вещей вне функции. В этом ответе я не буду перебирать все области видимости javascript, потому что это хорошо documented on many other questions, но по существу это ваша проблема;

(function(){ 
    var hello = "world"; 
}()); 
console.log(hello); // no good, hello is not declared in this scope 

Короче ИЗВЛЕКИТЕ анонимная функция, которая находится в вашем app.js или объявить переменную app вне функции.

2

ваше приложение определено внутри анонимной функции, поэтому приложение имеет область действия внутри него. попробуйте создать глобальную переменную приложения.

(function(){ 

app= angular.module('customersApp',['ngRoute']); 

app.config(['$routeProvider', 
    function ($routeProvider) { 
     $routeProvider. 
     when('/login', { 
      title: 'Login', 
      controller: 'loginController', 
       templateUrl: 'app/views/loginuser.html' 
     }) 
      .when('/logout', { 
       title: 'Logout', 
       templateUrl: 'partials/login.html', 
       controller: 'loginController' 
      }) 

      .when('/dashboard', { 
       title: 'Dashboard', 
       templateUrl: 'app/views/dynamic_table.html', 
       controller: 'loginController' 
      }) 
      .when('/signup', { 
       title: 'Signup', 
       templateUrl: 'app/views/registration.html', 
       controller: 'loginController' 
      }) 

      .otherwise({ 
       redirectTo: '/login' 
      }); 
    }]); 

}()); 
+0

помогло, глобально в index.js. Я использую браузер, поэтому не могу устранить любые анонимные функции. Browserify добавляет их в любом случае – moudrick

1

Удалить анонимную функцию из app.js как:

var app= angular.module('customersApp',['ngRoute']); 

app.config(['$routeProvider', 
    function ($routeProvider) { 
     // rest of the code 
    }]); 

А также переместить startFrom фильтр регистрационный код из блока управления. Последнее, что ваш контроллер принимает инъекцию зависимостей в последний раз: Data, который не определен, поэтому удалите это также.

Надеюсь, это поможет!

7

Похоже, что все остальные ответы получены от людей, не знающих Угловой JS, и только Javascript. Все они дают тот же ошибочный ответ, который может заставить код работать, но ввести плохую практику.

Обертка вашего кода в анонимной функции в порядке!

Это не проблема. Проблема в том, что вы поместили ваш контроллер в отдельный файл, но забыли поместить его в отдельный модуль.

loginController.js

angular.module('customersApp.loginController',[]) 

.controller('loginController', function ($scope,$http, Data) { 
    ... 
}); 

app.js

var app= angular.module('customersApp',['ngRoute','customersApp.loginController']); 

Этот ответ подкреплен угловом проектом семян, который также упоминается в официальных угловых документах: https://github.com/angular/angular-seed

+0

Ввод контроллера в отдельный файл с тем же модулем в порядке (если они связаны). Код, предоставленный OP, создаст 'Uncaught ReferenceError', потому что переменная' app' выходит за рамки. –

+0

Выполнение этого излишне затеняет ваш код, поэтому его следует считать плохой практикой. Существует также ничего, что намекает на идею, что это был преднамеренный выбор дизайна OP. – wvdz

2

Произошла такая же ошибка. В моем случае это был порядок файлов javascript.

Я должен был убедиться, что app.js был объявлен перед файлом service.js (файл, который имел ссылку на приложение в нем).

<script src="app.js"></script> 
<script src="/Scripts/Service.js"></script> 

Кроме того, эта ошибка («приложение не определенно») может быть вызвана ошибкой синтаксиса в вашем яваскрипта кода, так что проверить яваскрипт кода на наличие синтаксических ошибок, если есть «Uncaught SyntaxError» в паре с ним.

Смежные вопросы