2013-06-03 2 views
2

Люди, Я новичок в AngularJS, и я пытаюсь создать базовую иерархию HTML, связанную с иерархией модели, используя Angular. Мой модуль верхнего уровня выглядит так:Ошибка: нет контроллера в директиве

angular.module ('fooApp', ['ngResource', 'myList']), который объявлен как ng-app = "fooApp" в корневом div для моей страницы.

Я тогда HTML, который выглядит, как это в моей странице:

<my-item-list/> 

У меня есть второй модуль, который выглядит следующим образом:

var myList = angular.module('myList', []); 
myList.directive('myItemList', function factory() { 
    var directiveDefinitionObject = { 
     priority: 0, 
     templateUrl: '/assets/partials/my-item-list.html', 
     replace: false, 
     transclude: false, 
     restrict: 'E', 
     scope: false, 
     controller: function($scope, $element, $attrs, $transclude) { 
      // No Op 
      $scope.foo = 'bar'; 
     }, 
     compile: function compile(tElement, tAttrs, transclude) { 
      return { 
       pre: function preLink(scope, iElement, iAttrs, controller) { 
        // No Op 
       }, 
       post: function postLink(scope, iElement, iAttrs, controller) { 
        // No OP 
       } 
      } 
     }, 
     link: function postLink(scope, iElement, iAttrs) { 
      // No Op 
     } 
    }; 
    return directiveDefinitionObject; 
}); 

шаблон Парциальное HTML только содержит таблицу и ng-repeat на теге. Шаблон делает просто отлично, но моя консоль JavaScript содержит:

Error: No controller: myItemList 
    at Error (<anonymous>) 
    at h (http://localhost:9000/assets/javascripts/angular.min.js:41:458) 
    at i (http://localhost:9000/assets/javascripts/angular.min.js:43:415) 
    at http://localhost:9000/assets/javascripts/angular.min.js:48:191 
    at http://localhost:9000/assets/javascripts/angular.min.js:94:307 
    at h (http://localhost:9000/assets/javascripts/angular.min.js:78:33) 
    at http://localhost:9000/assets/javascripts/angular.min.js:78:266 
    at Object.e.$eval (http://localhost:9000/assets/javascripts/angular.min.js:88:347) 
    at Object.e.$digest (http://localhost:9000/assets/javascripts/angular.min.js:86:198) 
    at Object.e.$apply (http://localhost:9000/assets/javascripts/angular.min.js:88:506) <my-item-list> 

Я намерен для гнездования увеличения (например, заменить в частичном шаблоне HTML с другой директивой и мне действительно нужно, чтобы понять, что я делаю неправильно. Я чувствую, что делаю какую-то ошибку новичка. Всякий раз, когда я добавляю атрибут «require» к моему определению директивы, я получаю сообщение об ошибке «без контроллера», но с именем того, что мне нужно (даже если стараюсь и требуют ngRepeat или главного контроллера данной страницы)

+0

Настройка plnkr, воспроизводящий ваши вопрос ... отлично работает в jsFiddle (какие незначительные изменения внесены): http://jsfiddle.net/EZy2F/. У вас есть 'ng-controller', указанный где-нибудь? – Langdon

+0

Помните, что это больше, чем просто директива верхнего уровня. Мое ng-приложение находится в div, и у меня есть ng-контроллер, указанный на одном и том же div верхнего уровня. В основном модуле приложения есть контроллер, который моделирует модель. Второй модуль (myList) содержит единственную директиву, в которой URL-адрес шаблона не является шаблоном. –

+0

Итак, когда я беру HTML из своего файла URL-шаблона шаблона и размещаю его непосредственно в шаблоне: параметр, все работает нормально. Я получаю сообщение об ошибке «без контроллера», когда я использую URL-адрес шаблона. –

ответ

6

Это похоже на ошибку в Угловом:. http://github.com/angular/angular.js/issues/1903

Действительно ли ваша директива нуждается в контроллере? Я бы сказал, что в 9 случаях из 10 директив не нужен собственный контроллер (в основном они просто нуждаются в link).

Когда вы удаляете controller из директивы, появляется ошибка.

Редактировать: В частности, кажется, что проблема возникает при объединении controller и compile. Любая другая комбинация (контроллер + ссылка, компиляция + ссылка или любая из них) отлично работает.

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