Angular Browserify

#javascript #angularjs #browserify

#javascript #angularjs #browserify

Вопрос:

В настоящее время я экспериментирую с Browserify Angular и столкнулся со странной проблемой. Я создал файл в поддиректоре для моего вызываемого контроллера controllers/start-controller.js . `

В моем app.js файл У меня есть локальная переменная, которая ссылается на контроллеры:

var controllers = require('./controllers/');

Внутри controllers/ находится index.js файл, который ссылается на start-controller:

require('./start-controller');

А потом снова в моем app.js , чтобы вызвать контроллер, у меня есть следующее:

app.controller('StartController', ['$scope', controllers.StartController]);

В чем проблема:

При текущей настройке StartController не распознается, и Angular выдает эту ошибку. Однако, если я изменю локальную переменную, чтобы включить start-controller напрямую:

var controllers = require('./controllers/start-controller');

Тогда это работает нормально, но на самом деле это не то, что мне нужно. Я хотел бы иметь возможность ссылаться на контроллеры внутри controllers/index.js . Является ли app.controller что-то отсутствующим в вызове StartController, из-за чего он не может его распознать?

Комментарии:

1. Под «StartController не распознается» вы имеете в виду, что controllers.StartController это не определено? Можете ли вы создать небольшой пример? Я не могу воспроизвести какие-либо проблемы на моей стороне.

2. Я считаю, что ответ @RickvanMook является правильным решением, но публикация index.js была бы намного более полезной.

Ответ №1:

Не уверен в содержимом ваших index start-controller файлов и, но, похоже, вам нужно экспортировать StartController в свой индексный файл.

Попробуйте это в своем controllers/index.js

 exports.StartController = require('./start-controller');
 

Ответ №2:

Джеймс Холлидей (substack, создатель browserify) усердно работал над созданием руководства по browserify: https://github.com/substack/browserify-handbook

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

Я знаю, что это не прямой ответ на ваш вопрос, но я только недавно нашел этот ресурс, и хотел бы я знать, что он существовал раньше.

Для ознакомления с browserify я рекомендую посмотреть это видео tagtree: http://tagtree.tv/browserify-an-intro?share_code=uncoopered-inspirer

Комментарии:

1. Хотя это отличная ссылка и очень полезная, она не отвечает на вопрос.

Ответ №3:

Что-то удивительное в Angular — это то, насколько он модульный по дизайну. Модульность также поддается модульному тестированию для каждого модуля.

Внутри вашего index.js файл, в котором вы могли бы установить угловой модуль:

 module.exports = angular.module('app.controllers', [
  require('./start-controller').name
]);
 

А затем внутри вашего start-controller.js файл:

   module.exports = angular.module('app.controllers.startController', [])

  .controller('StartCtrl', ['$scope',

    function($scope, ) {

    }
  ]);
 

Теперь, когда вы хотите протестировать только контроллер запуска, он уже изолирован внутри angular.

На этом этапе, если вы хотите добавить этот модуль в более крупное приложение, например, в корневое приложение, вы должны выполнить точно такой же процесс на верхнем уровне:

  module.exports = angular.module('app', [
    'ui.router', // Third party library that we've pulled in with an earlier require()
    require('./controllers').name
  ]);
 

А затем внутри вашего index.html файл:

 <html lang="en" ng-app="app" class="no-js">