AngularJS：控制器獨立$ routeProvider的越來越的ReferenceError

我有一個角度應用程序，它具有以下HTML結構

的div[class="ng-view-wrap"]內容取決於URL的，但div[class="login-wrap"]存在的每一頁上，並通過rootCtrl

處理

其通過$routeProvider激活控制器被工作，但rootCtrl不工作

正如你可以看到我即使在NG-控制器（rootCtrl 作爲根使用"root"）以及在loggedIn（根.loggedIn）的表達式中，以便將作用域引用到rootCtrl。

角度誤差：參數 'rootCtrl' 不是一個函數，得到了不確定

HTML：

<div class="ng-view-wrap" ng-view=""></div> 

<div class="login-wrap" ng-controller="rootCtrl as root"> 
    <div class="login"> 
     <p class="login-status">{{"Status: " + root.loggedIn }}</a> 
    </div> 
</div>

app.js：

var mspBoard = angular 
    .module('mspBoard',['ngRoute']) 
    .config(function($routeProvider){ 
     $routeProvider 
      .when('/', 
       { 
        controller: 'boardCtrl', 
        templateUrl: 'js/views/board.html' 
       }) 
      .when('/:project', 
       { 
        controller: 'projectCtrl', 
        templateUrl: 'js/views/project.html' 
       }) 
      .when('/:project/:topic', 
       { 
        controller: 'topicCtrl', 
        templateUrl: 'js/views/topic.html' 
       }) 
      .otherwise({redirectTo: '/'}); 
    }); 
mspBoard.controller('rootCtrl',['$scope', function($scope){ 
    $scope.loggedIn = true; 
}]); 
mspBoard.controller('boardCtrl',['$scope', function($scope){ 
    // Do Something 
}]); 
mspBoard.controller('projectCtrl',['$scope', function($scope){ 
    // Do Something 
}]); 
mspBoard.controller('topicCtrl',['$scope', function($scope){ 
    // Do Something 
}]);

來源

2014-11-03 Sagi_Avinash_Varma

如果您嘗試使用其他控制器，例如'boardCtrl'，它可以工作嗎？ – 2014-11-03 12:58:21

其他問題：ng-app的定義在哪裏？ – 2014-11-03 12:59:06

html上的ng-app boardCtrl工作正如我所說的一個與$ routeProvider相關的控制器 – 2014-11-03 13:08:37

你是在這裏混合兩種類型的語法controller和controller as。

在你rootCtrl添加一行：

this.loggedIn = true;

如果您正在使用controller as（這是正確的做法IMO），那麼當你定義控制器this將被視爲範圍的控制，而不需要注入$scope。您需要將$scope注入控制器的唯一原因是利用事件（$ broadcast，$ emit，$ on）或觸發摘要循環（$ digest，$ apply）。

我以您的示例代碼爲基礎創建了這個PLNKR。

來源

2014-11-03 13:35:56 Brocco

AngularJS：控制器獨立$ routeProvider的越來越的ReferenceError

回答

相關問題