2014-06-29 42 views
0

,我發現了以下錯誤在我的控制檯:控制器無法找到在指令錯誤

Error: [$compile:ctreq] Controller 'gamesList', required by directive 'searchTerm', can't be found!

下面是我使用的代碼:

遊戲列表:

<div class = "bit-75-percent games-list" data-ng-controller = "GamesController"> 
    <ng-include src = "'../templates/simpleSearch.tpl.html'"></ng-include> 
    <div class = "game" data-ng-repeat = "game in games" data-games-list> 
     {{game.name}} 
    </div> 
</div> 

查詢表格:

<form class = "simple-search" data-ng-controller ="SearchController"> 
    <input type = "text" name = "search-term" class = "search-term" data-search-term> 
    <div data-pane></div> 
</form> 

的遊戲指令

(function(window, angular, undefined) { 
    var app; 

    app = angular.module('games'); 

    app.directive('gamesList', function(GamesService) { 
     console.log('Loaded gamesList directive'); 
     return { 
      controller: function(scope) { 
       scope.updateGamesList = function(gamesList) { 
        scope.games = gamesList; 
       }; 
      }, 
      restrict: 'A', 
      scope: {}, 
      transclude: true 
     }; 
    }); 
}(window, window.angular)); 

搜索指令:

(function(window, angular, undefined) { 
    var app; 

    app = angular.module('search'); 

    app.directive('searchTerm', function(GamesService) { 
     console.log('Loaded searchTerm directive'); 
     return { 
      restrict: 'A', 
      require: 'gamesList', 
      scope: {}, 
      transclude: true, 
      link: function(scope, element, attr) { 
       element.on('keyup', function() { 
        GamesService.query(); 
       }); 
      } 
     }; 
    }); 
}(window, window.angular)); 

我已經試過和/或雙重檢查

  1. 指定scope而不是每個指令之間交替。
  2. 確保在gamesList指令之前加載searchTerm
  3. 確保兩個指令都已加載。

我不知道我在做什麼錯在這裏。有人能指引我朝着正確的方向嗎?

+1

嘗試'要求: 「^ gamesList」'。看到區別[這裏](https://docs.angularjs.org/api/ng/service/$compile) – haki

回答

0

指令定義對象的require屬性允許確保您已在同一元素或其父母中指定了指令。它不能用於檢查頁面上任何位置存在指定的指令。

BTW,控制器的參數由$injector服務解決,應適當命名爲:$scope但不是scope

相關問題