Angularjs: ReferenceError: Umfang ist nicht definiert

Ich bin ein Anfänger mit Angularjs, und ich habe einige Schwierigkeiten Verständnis Module und Bereiche.

Ich erhalte die Fehlermeldung, dass der Geltungsbereich nicht definiert ist, aber ich verstehe nicht, warum. Zuerst hatte ich meinem controller verbunden, wo ich meine route, aber da die Funktion im controller aufgerufen wird, auf "Absenden" - button klicken, ich nahm es Weg. Ich habe versucht, dass es wieder, aber das machte keinen Unterschied.

Dies ist mein js-Datei:

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

//routes
myApp.config(function($routeProvider) {
    $routeProvider

        //route for the home page
        .when('/', {
            templateUrl : 'home.html',
            controller  : 'mainController'
        })

        //route for the about page
        .when('/about', {
            templateUrl : 'about.html',
            controller  : 'aboutController'
        })

        //route for the login page
        .when('/login', {
            templateUrl : 'login.html'
        });
});


myApp.controller('mainController', function($scope) {
    $scope.message = 'Beginpagina';
});

myApp.controller('aboutController', function($scope) {
    $scope.message = 'Informatie over deze pagina';
});


function loginCtrl($scope, $http){
    $scope.doLogin = function() {

    $http({

                method: 'POST', 
                url: 'loginController.php',
                headers: {'Content-Type': 'application/x-www-form-urlencoded'},
                data: { 
                        'username': $scope.un, 
                        'password': $scope.pw 
                     },
            }).

            success(function(data, status) {

                $scope.data = data;
                if(data == 'FALSE'){
                    $scope.errorMessage = 'Geen geldige inloggegevens';
                } else {
                   scope.$apply(function() { $location.path("/profile"); });
                }

            }).

            error(function(data, status) {
                $scope.data = data || "FALSE";
                $scope.errorMessage = 'Something went wrong';
            });
    };
};

Und dies ist mein login-Seite, wo ich den Fehler, zu versuchen, um melden Sie sich an:

<div class="span5" ng-controller="loginCtrl"> 
    <form>
       <fieldset>
              <div class="form-group">
                <input class="form-control" placeholder="Gebruikersnaam" ng-model="un" 
                  type="text" autocomplete="off">
               </div>
               <div class="form-group">
                  <input class="form-control" placeholder="Password" ng-model="pw"  
                    type="password" value="" autocomplete="off">
               </div>
               <input class="btn btn-lg btn-success btn-block" type="submit" 
                 ng-click="doLogin()" value="Login">
               <div>{{errorMessage}}</div>
           </fieldset>
       </form>
   </div>

Ich weiß nicht, ob ich posten sollte die index-Seite als gut, da das routing für zu Hause/über uns " - Seite funktioniert gut, das problem ist also irgendwo machen den logincontroller und verknüpfen es mit meinem submit-button. Ich habe einige ähnliche Fragen, aber ich habe nicht gesehen, jeder mix einen neuen controller mit myApp-Controller, so könnte ich es tun völlig falsch. Ich habe auch gelesen, dass eine html-Seite kann nur ein Modul, so dass ich nicht wusste, ob ich könnte die login-controller abgesehen. Es wäre schön, ein paar mehr Infos in die richtige Richtung. Vielen Dank im Voraus!

InformationsquelleAutor Iris Van de Zandschulp | 2014-01-10