2015-09-07 4 views
0

Я вроде нового в рамках AngularJS, и я пытаюсь перенести мой тестовый проект, используя стандартный маршрутизатор использовать UI-маршрутизатор, но я получаю следующее сообщение об ошибке:Угловая UI-маршрутизатор, контроллер не определен

Error: [ng:areq] Argument 'mainCtrl' is not a function, got undefined 

То, что я сделал до сих пор является:

контроллер:

// mainCtrl.js 
angular.module("sm-web") 
    .controller('mainCtrl',['$scope', 
      function($scope) { 
       ... 
    }]); 

маршрутизатор:

angular.module('sm-web', ['ui.router']) 
    .config(['$stateProvider', '$urlRouterProvider', function($stateProvider, $urlRouterProvider) { 

    $urlRouterProvider.otherwise('root'); 

     $stateProvider 
      .state('root', { 
       url: '', 
       templateUrl: path + 'ng/sm/view/main.html', 
       controller: 'mainCtrl' 
     }); 

    }]); 

индекс:

<body ng-controller="mainCtrl"> 
    <main-menu></main-menu> 
    <div class="container"> 
     <div ui-view></div> 
    </div> 
</body> 

Это работает, когда я использую стандартный маршрутизатор, но не с UI-маршрутизатором. Кто-нибудь имеет представление о том, что я делаю неправильно?

+0

Поместите '' 'после' $ scope' в свой контроллер – Lauromine

+2

Не нужно писать 'ng-controller =" mainCtrl "' вы уже привязываете 'mainCtrl' к шаблону' ng/sm/view/main.html' в ваш маршрутизатор. –

+1

Метод ['иначе'] (https://github.com/angular-ui/ui-router/wiki/URL-Routing#otherwise-for-invalid-routes) получает URL-адрес, а не состояние. Я не уверен, что это кусает ваши проблемы, но попробуйте. – gfpacheco

ответ

1

Кажется, у вас есть проблема, ж/заказа вы объявляете вещи. Для вас, чтобы объявить модуль «СМ-сеть» вы должны сделать это:

angular.module('sm-web', ['ui.router']); 

Обратите внимание, что наличие этого второго массива аргумента то, что говорит Угловое, что вы объявляя модуль (например, создание нового. модуль). Когда вы покидаете этот второй аргумент, вы получаете модуль, который вы ранее объявили.

Так с этим в виду, посмотрим, как все это объединяется в вашем коде:

  • Чтобы объявить контроллер, вы извлекаете модуль «СМ-сеть» (убрав 2-й ARG массива).
  • При настройке состояний маршрутизатора вы объявляете новый модуль «sm-web». Но обратите внимание, что сразу после объявления этого нового модуля вы пытаетесь зарегистрировать состояние с контроллером с именем «mainCtrl», но этого еще не существует.

Вам необходимо создать модуль где-нибудь, прежде чем делать все вышеперечисленное. После создания модуля зарегистрируйте контроллер на модуле. Наконец, с установленным контроллером, вы можете зарегистрировать состояние, использующее контроллер.

Существует слишком много способов решить эту проблему заказа, поэтому я больше ничего не собираюсь предлагать. Это зависит от того, в каких файлах живет код, и в каком порядке вы загружаете эти файлы в index.html.

+0

Ну, как я сказал SunilD, я попытался заказать импорт по-разному, но безуспешно. Однако, даже если есть ошибка с импортом, почему код работает с использованием другого маршрутизатора? –

+0

Оказывается, это было правильно. Я неправильно добавлял ui.router в свой router.js, а не в моем app.js (я не показывал содержимое этого файла в моем вопросе, потому что думал, что с ним ничего не случилось). Большое спасибо! –

0

Для того, чтобы избежать ваша проблема изменить код следующим кодом:

// mainCtrl.js

angular.module("sm-web") 
    .controller('mainCtrl',['$scope', 
      function($scope) { 
       ... 
    }]); 
+0

Извините, «отсутствует, потому что я случайно удалил его, когда редактировал вопрос. Виноват. –

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