在AngularJS模塊中設置templateUrl以增加模塊性

我嵌套了angularJS模塊EventList和EventPage。在AngularJS模塊中設置templateUrl以增加模塊性

的目錄結構如下所示：

app.js 
EventForm 
|_ EventList.js 
    eventListView.html 
    EventPage 
    |_EventPage.js 
    eventPageView.html

Eventlist.js：

angular.module('EventList', ['EventPage']) 

.config([ '$routeProvider', function config($routeProvider){ 
    $routeProvider.when(Urls.EVENT_LIST, { 
     templateUrl: 'app/EventList/event-list.html', 
     controller: 'EventListCtrl' 
     }); 
}]) 


.controller('EventListCtrl', ['$scope', '$location', '$http', function EventListController($scope, $location, $http) { 

}]);

EventPage.js：

angular.module('EventPage', []) 

.config([ '$routeProvider', function config($routeProvider){ 
    $routeProvider.when(Urls.EVENT_PAGE + '/:id', { 
     templateUrl: 'app/EventList/EventPage/event-page.html', 
     controller: 'EventPageCtrl' 
     }) 
}]) 


.controller('EventPageCtrl', ['$scope', '$routeParams', '$http', function EventPageController($scope, $routeParams, $http) { 

    }]);

顯然templateUrl被硬編碼現在。我的問題是在routeProvider中設置templateUrl的最佳方法是什麼，以便模塊不依賴於硬編碼的目錄結構，並且可以在不中斷的情況下取出並在其他AngularJS項目中重用它們？有沒有辦法在當前文件夾中獲得insertViewNameHere.html？

來源

2013-07-18 HighLife

如果您使用Grunt，這很容易。不是因爲模塊化AngularJS是微不足道的，但因爲所有的辛勤工作已經爲你以良好的民間做angular-bootstrap ...

當我面對這個問題，我簡單地下載他們的Gruntfile並改爲每ui.bootstrap到my-angular-module完成。由於我模仿了他們的基本目錄結構，它開箱即用。

此外，您可能需要更新Angular和Bootstrap版本。例如，改變

ngversion: '1.0.8', 
bsversion: '2.3.1',

到

ngversion: '1.2.3', 
bsversion: '3.0.2',

來源

2013-11-28 19:42:21

在AngularJS模塊中設置templateUrl以增加模塊性

回答

相關問題