2014-01-10 121 views
4

我是Angularjs的初学者,在理解模块和范围时遇到一些困难。Angularjs:ReferenceError:范围未定义

我不断收到范围未定义的错误,但我不明白为什么。首先,我把我的控制器连接到我设置路由的地方,但由于控制器内部的功能在提交按钮上调用,因此我将它拿走了。我试过把它放回去,但这没有任何区别。

这是我的js文件:

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'; 
      }); 
    }; 
}; 

,这是我的登录页,我得到的错误,试图登录:

<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> 

我不知道该不该发布索引页面,因为家庭/关于页面的路由工作正常,所以问题在于使登录控制器连接到我的提交按钮。我发现了一些类似的问题,但我没有看到任何人将新控制器与myApp控制器混合使用,所以我可能会完全错误。我也读过一个HTML页面只能有一个模块,所以我不知道是否可以将登录控制器分开。将更多的信息放在正确的方向将是很好的。提前致谢!

+0

作为@Satpal指出了错误来自于一个事实你引用'scope'而不是'scope'。但是,您不需要'$ scope。$ apply()'。承诺的'成功'回调将已经在'$ digest'中。 –

+0

好的..有点尴尬:)只是证明我需要休息一下..我怎么会去路由到一个页面上成功的登录,因为$位置似乎也未定义:/ –

回答

9

loginCtrl,你已经使用scope代替$scope

问题是线

scope.$apply(function() 

使用

$scope.$apply(function()