requirejs + angularjs代碼結構拆分在不同的文件

我正在使用requirejs和Angular，我試圖創建一個應用程序結構，允許我在不同的文件中拆分每個控制器/服務/指令等。這是我想達到的結構：requirejs + angularjs代碼結構拆分在不同的文件

src/ 
components/ 
    Navigation/ 
     index.js 
     module.js 
     NavigationController.js 
     NavigationService.js

在module.js我想要做這樣的事情：

define(['angular', './NavigationService', './NavigationController'], function (angular, NavigationService, NavigationController) { 
    'use strict'; 
    return angular.module('Myapp.Navigation', []) 
     .controller('NavigationController', NavigationController) 
     .service('NavigationService', NavigationService) 
});

而且在分離具有限定控制器/服務定義js文件。

問題是我不知道如何定義這些文件。我試過這個語法：

//NavigationService.js 
define(function() { 

      this.doNavigation = function() { 
       console.log('I am navigating'); 
      } 
    });

但看起來沒有工作。你有沒有見過這種使用requirejs的結構？

謝謝！

來源

2015-06-20 gabric

嘗試：

//NavigationService.js 
define([], function() { 
    NavigationController.$inject = ['$scope', '$q', 'myOwnService', 'etc']; 
    function NavigationController($scope, $q, myOwnService, etc) { 
     ... 
    } 
    return NavigationController; 
});

您還可能有興趣在angular-require-lazy。

來源

2015-06-20 11:08:05

Efharisto Nikos。此解決方案完美運作。 – gabric

實際上，如果是單一申請，你不需要requirejs。角度中的頂級層次結構是應用程序。所有的應用程序都有它的一套模塊，並且angular應該從一開始就擁有所有的源代碼，所以你不需要使用requirejs來加載它。

相反，我建議您使用grunt和concat插件。它會將應用程序的所有部分組合在一起，並且每個應用程序都有單個文件。

然後，當每個應用程序有一個文件時，可以使用requirejs加載它，它有意義，但不加載模塊。

另外檢查angular code style，它有很多關於如何正確書寫的建議。

UPD：關於你的問題：如果你已經設置了爲您的應用程序（我的意思是你有很多他們的），那麼你很可能在使用require.js與angular.js共同感興趣的模塊。在這種情況下，從這篇文章read and follow recommendations。否則，你真的不需要require.js

來源

2015-06-20 10:43:10 outoftime

感謝您的回覆。不幸的是，由於其他原因，我必須使用requirejs（項目更復雜，它使用庫，這只是它的一小部分）。我正在使用grunt-contrib-requirejs – gabric

@ gabric閱讀上面的文章，它沒有幾個主要想法我發現並不明顯：requirejs和angularjs有單獨的注入管理器;如果使用requirejs，則應該使用手動引導進行角度轉換。 – outoftime

requirejs + angularjs代碼結構拆分在不同的文件

回答

相關問題