2014-04-07 73 views
2

我正在使用帶有angular-js的required-js作爲我的項目之一來加載腳本文件。在正常情況下,用out-js我用來將控制器存儲在一個變量中,並將結果解析爲像variable.resolve這樣的變量,並在應用程序配置中提到解析函數。 但通過使用required-js,我正在定義模塊中的所有內容。所以我創建控制器模塊並在那裏存儲控制器,所以我使用控制器名稱而不是function.below是我的配置和控制器模塊的代碼。我不想在配置中寫入我的解析邏輯。它應該在控制器文件中。我該如何處理角度js。Angular js:如何在需要js時使用resolve解決方案

define(
    ['angular', 'angular-route', 'controllers', 'directives', 'filters', 'services', 'common-controllers', 'common-directives', 'common-helpdesk-feedback-directives', 'common-constants', 'plunker', 'require'], 
    function(angular, angularRoute, controllers, directives, filters, services, commonControllers, commonDirectives, commonHelpDeskFeedbackDirectivesModule, plunker) { 
     var app = angular.module('app', ['ngRoute', 'controllersModule', 'directivesModule', 'filtersModule', 'servicesModule', 'commonControllersModule', 'commonDirectivesModule', 'commonHelpDeskFeedbackDirectivesModule', 'plunkerModule']); 
     app.init = function() { 

      setTimeout(function() { 
       angular.bootstrap(document, ['app']); 
      }, 2000) 
     } 
     app.config(function($routeProvider, $httpProvider) { 
      $routeProvider 
       .when('/', { 
        template: '<div align="center" ><h1>This is default helpdesk page !</h1></div>', 
       }) 
       .when('/list/:view', { 
        templateUrl: '../../themes/ngCus/templates/helpdesk/listing.html', 
        controller: 'listCtrl', 
       }); 

     }); 
     return app; 

    } 
); 

這裏我控制器模塊

// Define all your controllers here in controller angular module 
define(['angular'], function function_name (angular) { 
    var controller = angular.module('controllers', []); 
    controller.controller('listCtrl', ['$scope', function($scope){ 
     $scope.message = 'This is dashboard default page !'; 
    }]); 
    return controller; 
}); 
+0

這已被問過很多次了,我在大型企業項目中使用的最乾淨的解決方案是[dan wahlin建議的](http://weblogs.asp.net/dwahlin/archive/2013/05 /22/dynamically-loading-controllers-and-views-with-angularjs-and-requirejs.aspx)。 –

+0

查看[angularAMD](http://marcoslin.github.io/angularAMD/),簡化使用RequireJS和AngularJS – marcoseu

+0

@MohammadSepahvand:這並沒有解決問題..我想寫我的代碼在控制器文件不在我配置我的應用程序的文件 –

回答

0

她是在控制文件

/*reslve function for listCtrl */ 
    controllersModule.resolvelistCtrl = function($q, $timeout) { 
     /*resolve logic here*/ 
    }; 

/*reslve function for otherCtrl*/ 
     controllersModule.resolveOtherCtrl = function($q, $timeout) { 
      /*resolve logic here*/ 
     }; 

答案

在自舉文件

define(
     ['angular', 'angular-route', 'controllers', 'directives', 'filters', 'services', 'common-controllers', 'common-directives', 'common-helpdesk-feedback-directives', 'common-constants', 'plunker', 'require'], 
     function(angular, angularRoute, controllers, directives, filters, services, commonControllers, commonDirectives, commonHelpDeskFeedbackDirectivesModule, plunker) { 
      var app = angular.module('app', ['ngRoute', 'controllersModule', 'directivesModule', 'filtersModule', 'servicesModule', 'commonControllersModule', 'commonDirectivesModule', 'commonHelpDeskFeedbackDirectivesModule', 'plunkerModule']); 
      app.init = function() { 

       setTimeout(function() { 
        angular.bootstrap(document, ['app']); 
       }, 2000) 
      } 
      app.config(function($routeProvider, $httpProvider) { 
       $routeProvider 
        .when('/', { 
         template: '<div align="center" ><h1>This is default helpdesk page !</h1></div>', 
        }) 
        .when('/list/:view', { 
         templateUrl: '../../themes/ngCus/templates/helpdesk/listing.html', 
         controller: 'listCtrl', 
         resolve: { 
          detailsData: controllers.rsolvelistCtrl, 
          otherData: controllers.resolveOtherCtrl 
          /*we can add more here*/ 
         }, 
        }); 

      }); 
      return app; 

     } 
    );